HTML语法规范

HTML语法规则

1. HTML 标签是由尖括号包围的关键词 ，标签通常是成对出现的，例如 <html> 和 </html>，称为双标签 。标签对中的第一个标签是开始标签 ，第二个标签是结束标签
2. 单标签 比较少，例如<br />，加一个/即可

标签关系

双标签关系可以分为两类：包含关系 和并列关系

//包含标签：
<html>
    <head></head>
</html>
//并列关系：
<html>
    <head></head>
    <body> </body>
</html>

HTML 基本结构标签

1. HTML页面也称为 HTML 文档
2. HTML 文档的的后缀名必须是 .html 或 .htm ，浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。这也就提醒我们，用记事本时，要修改后缀名。
3. 此时，用浏览器打开这个网页，可以预览HTML 文件了

vscode使用技巧

1. ctrl + / - 放大缩小页面
2. shift + alt + 下箭头 快速赋值上一行
3. ctrl + d 选定多个相同的单词，双击单词，再按快捷键，可同时修改多个单词
4. ctrl + alt + 上箭头/下箭头 ，添加多个光标，同时修改多行
5. ctrl + h 全局替换某些单词
6. ctrl + g 快速定位到某一行
7. shift + alt 然后拖动鼠标，可以选择某个区块进行操作
8. ctrl + / 单行注释

DOCTYPE

<!DOCTYPE html>  文档类型声明标签,告诉浏览器这个页面采取html5版本来显示页面.

注意：

1. <!DOCTYPEl> 声明位于文档中最前面的位置 ，处于<html>标签之前
2. <!DOCTYPEl>不是一个HTMl标签，他就是文档类型声明标签

HTML常用标签

标题标签

特点：

1. 加了标题的文字会变的加粗，字号也会依次变大。
2. 一个标题独占一行
3. 标题标签为双标签 ，成对出现<h1></h1>
4. 重要性h1到h6一次递减

段落标签

1. 需要注意的是，在软件使用时我们人为的换行，在网站打开是不起作用的 ，无论打一个空格还是10个空格，都只会显示一个空格，因此需要段落标签帮助我们进行分段处理
2. 双标签 ：<p> 我是一个段落标签 </p>
3. vscode中查看 -- 自动换行
4. 特点：
   1. 文本在一个段落中会根据浏览器窗口的大小自动换行。
   2. 段落和段落之间保有空隙。

换行标签

1. 在 HTML 中，一个段落中的文字会从左到右依次排列，直到浏览器窗口的右端，然后才自动换行。如果希望某段文本强制换行 显示，就需要使用换行标签 <br />。
2. 特点：
   1. <br /> 是个单标签 。
   2. <br /> 标签只是简单地开始新的一行，跟段落不一样，段落之间会插入一些垂直的间距，
   3. 不会形成如段落一样的较大缝隙，在网页上看就是单纯的另起一行，而不是另起一段。

文本格式化标签

特殊标签

1. <div>和<span>标签，是是没有语义的，它们就是一个盒子，用来装内容的。
2. 特点：
   1. <div> 标签用来布局，但是现在一行只能放一个<div>，也就是说一个<div>占一整行，后面再写内容会在<div>的下面显示 。 大盒子
   2. <span> 标签用来布局，一行上可以多个 <span> 。小盒子
   3. 都是双标签