共计 1475 个字符，预计需要花费 4 分钟才能阅读完成。
一. 网页固定格局
1. 编写网页的步骤:
- 新建一个文本文档
- 利用记事本关上
- 编写 THML 代码
- 保留并且批改纯文本文档的扩大名为.html
- 利用浏览器关上编写好的文件
1.1 WebStorm 常见快捷键
-
如何在 WebStorm 中利用快捷键创立一个新的.html 的文件
- 同时按下键盘上的 Ctrl + Alt + Insert
-
如何在 WebStorm 中让光标挪动到以后行的开端
- 按下键盘上的 End 键即可
-
如何在 WebStorm 中让光标挪动到以后行的最后面
- 按下键盘上的 Home 键即可
-
如何在 WebStorm 中让光标在多行中闪动
- 按住键盘上的 Alt 键不放, 而后再按住鼠标的左键不放, 而后再拖动鼠标即可
-
如何在 WebStorm 中疾速的复制光标所在的那一行
- 按下键盘上的 Ctrl + D
-
如何在 WebStorm 中疾速的删除光标所在的那一行
- 按下键盘上的 Ctrl + X
-
如何在 WebStorm 中让标签包裹一段内容, 也就是主动在一段内容前后加上标签
- 按下键盘上的 Ctrl + Alt + T, 而后按下回车, 而后输出对应的标签即可
2. 网页根本构造
<html lang="en">
<head>
<meta charset="UTF-8">
<title> 音视频测试 </title>
</head>
<body>
</body>
</html>
- 通过观察咱们发现, HTML 根本构造中所有的标签都是成对呈现的, 这些成对呈现的标签中有一个带 / 有一个不带 /, 那么这些不带 / 的标签咱们称之为开始标签, 这些带 / 的咱们称之为完结标签
二. 网页标签
1.HTML 标签
- 作用: 用于通知浏览器这是一个网页, 也就是说通知浏览器我是一个 HTML 文档
留神点: 其它所有的标签都必须写在 html 标签外面, 也就是写在 html 开始标签和完结标签两头
2.head 标签
- 作用:
用于给网站增加一些配置信息 -
例如:
- 指定网站的题目 / 指定网站的小图片
- 增加网站的 SEO 相干的信息(指定网站的关键字 / 指定网站的形容信息)
- 外挂一些内部的 css/js 文件
- 增加一些浏览器适配相干的内容
留神点:
个别状况下, 写在 head 标签外部的内容都不会显示给用户查看, 也就是说个别状况下写在 head 标签外部的内容咱们都看不到
3.title 标签
- 作用:
专门用于指定网站的题目, 并且这个指定的题目未来还会作为用户保留网站的默认题目
留神点:
title 标签必须写在 head 标签外面
4.body 标签
- 作用:
专门用于定义 HTML 文档中须要显示给用户查看的内容(文字 / 图片 / 音频 / 视频)
留神点:
尽管说有时候你可能将内容写到了别的中央在网页中也能看到, 然而千万不要这么干, 肯定要将须要显示的内容写在 body 中
一对 html 标签中 (一个 html 开始标签和一个 html 完结标签) 只能有一对 body 标签
5.meta 标签
- 作用 : 在编写网页的时候指定字符集, 可避免出现乱码景象
<meta charset="UTF-8">
GBK(GB2312)和 UTF- 8 区别
- GBK(GB2312)外面存储的字符比拟少, 仅仅存储了汉字和一些罕用外文
体积比拟小 - UTF- 8 外面存储的世界上所有的文字, 提交比拟大
集体举荐: 所有一律都写 UTF-8
三.HTML 标签分类
1. 单标签
- 只有开始标签没有完结标签, 也就是由一个 <> 组成的
<meta charset="UTF-8" />
2. 双标签
- 有开始标签和完结标签, 也就是由一个 <> 和一个 </> 组成的
<html>
</html>
四.HTML 标签关系分类
1. 并列关系(兄弟 / 平级)
<head>
</head>
<body>
</body>
2. 嵌套关系(父子 / 上下级)
<head>
<meta charset="UTF-8" />
<title> 音视频测试 </title>
</head>
正文完
发表至： javascript
2021-03-22
