目录
一.语法：
前言：
HTML里面的标签就像C语言里面的关键字一样，每个标签都有自己的语义(含义功能)，如<a>代表超链接，<br>代表换行。根据标签的不同，浏览器会使用不同的方式展示标签中的内容，有时候也把HTML文件里面的标签称为HTML中的元素。
1.HTML标签的语法格式：
一般来说大部分的HTML标签由开始的标签，属性，内容和结束的标签组成，标签的名字不区分大小写，但大多数属性的值需要区分大小写，如下所示:
<p class="change">此表示可以显示一段文本</p>
除了上述的class属性以外，开始标签中还可以包含其他属性信息，比如id，title这些。
需要注意的是：虽然HTML标签在语法上不区分大小写，但是为了规范和专业，强烈建议在定义标签时一律采用小写。
当我们用浏览器打开自己编写的html文档时，浏览器会从上到下依次读取文档里面的内容，并根据html的属性将标签中的内容呈现在浏览器中。
HTML文档中必须具有一些html的标签，以方便浏览器区分普通文本和HTML文档， 你可以根据想要实现的效果使用任意数量的标签，但需要注意几点:
- 所有HTML都有<>如果没有就会被认为是文本
- html中不同标签可以有不同的效果
- 如果使用了某个标签，则必须使用对应的结束标签来结尾(自闭合标签除外，也称为单标签)。
自闭合标签：
在html中有一些标签并没有单独的结束标签，而是在开始标签中添加/来进行闭合，这种标签称为自闭合标签，如下几例:
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.EpxMzbWHD39VZ-nmL0fs4AHaFj?w=195&h=180&c=7&r=0&o=5&dpr=1.5&pid=1.7" alt="">
<hr>
<br>
<input type="text">自闭合标签不用包围内容，所以不需要单独的结束标签，只有少部分标签时自闭合标签。
2.嵌套HTML标签：
在HTML文档中是可以嵌套的，也就是说一个html标签里面可以包含其他的html标签，我们写的html文档就是由相互嵌套的html标签构成的，如下所示:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.EpxMzbWHD39VZ-nmL0fs4AHaFj?w=195&h=180&c=7&r=0&o=5&dpr=1.5&pid=1.7"
alt="">
<p class="change">此表示可以显示一段文本</p>
<a href="https://www.bilibili.com/">此链接到bilibili</a>
<ul>
<li>
<a href="https://www.bilibili.com/">
<b>此链接到bilibili</b>
</a>
</li>
<li>无序列表第二行</li>
<li>无序列表第三行</li>
</ul>
<hr>
<br>
<input type="text">
</body>
</html>上述新代码的说明:
- <b>：此标签用来加粗文本。
- <hr>：此标签用来设置分隔线。
- <br>：此标签用来换行。
html标签的嵌套是没有限制的，但是我们应该尽量保持html文档的简洁，上面代码中嵌套层次最深的标签时<b>，它的嵌套路径为:
html -> body -> ul -> li -> a -> b
总结：
html的语法其实就是规范只需要在<>以内还需要对的标签，即可嵌套也可以不嵌套，帮助我们更清晰的看清结构。
二.属性：
前言：
在html中属性就是对一个标签额外的设置，比如一张图片我要设置它的大小等等，如下几个属性:
- href：属性可以是<a>标签中提供链接地址(URL)的.
- src：属性可以为<img>提供对应的图片路径。
- style：属性可以为所有的标签定义CSS的样式。
1.什么是属性：
属性可以给html标签提供一些额外的信息，或者对html标签进行修饰，属性需要添加在开始的标签里面，语法格式为:
class="chang"
其中class为属性名，value是属性的值，属性值必须使用双引号""或者单引号' '包围。但是在大部分时候都是使用双引号。
一个标签可以没有属性，也可有多个属性.如下是使用属性的示例代码:
<ul>
<li style="color: aquamarine;">此文本的颜色为青色</li>
<li>
<a href="https://www.bilibili.com/">点击跳转bilibili</a>
</li>
</ul>运行结果如下：
专用属性：
HTML中的属性大致分为两种：
- 有些属性可以在大部分或者所有的html标签里面使用，此类属性为通用属性。
- 有些属性只能在一个或者几个特定的html标签里面使用，此类属性为专用属性。
html中的<img>标签有src和alt两个专用属性,还有<a>标签也有href和target两个专用的属性，如下:
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.EpxMzbWHD39VZ-nmL0fs4AHaFj?w=195&h=180&c=7&r=0&o=5&dpr=1.5&pid=1.7"alt="图片存在吗？">
<a href="https://www.bilibili.com/" target="_blank">此链接到bilibili</a>说明:
- <img>：标签中的src属性是用来定义图像的路径的，alt属性是用来描述图像的信息的，当图像无法正常显示的时候就会显示alt里面的信息。
- <a>：标签的href属性是用来定义链接的地址，target属性是用来指定在浏览器中打开的方式。
2.通用属性介绍：
html标签中有一些通用的属性，如id，title，class，style等，这些通用属性可用在大多数html标签中使用，下面是他们的用法:
1).di:
id属性用来赋予某个标签唯一的名称(标识符)，当我们使用CSS或者JavaScript操作这个标签时，就可以通过id属性来找到这个标签。
为标签定义id属性可以给我们提供很多便利，如下:
- 如果标签中带有id属性作为唯一标识符，通过id属性可很方便的定位到该标签；
- 如果html文档中包含多个同名的标签，利用id属性的唯一性，可以很方便的区分他们。
如下:
<b id="url">https://www.bilibili.com/</b>
<a href="https://www.bilibili.com/" id="content">bilibili</a>2).class:
与id属性类似，class属性也可以为标签定义名称(标识符)，不同的事class属性在整个html文档中不是唯一的，我可以为多个标签定义相同的class属性值，还可以为一个标签定义多个class属性值（他们之间需要使用空格隔开），如下所示：
<div class="Name1 Name2 Name3"></div>
<p class="cont"></p>
<div class="cont Name1"></div>当使用CSS或者JavaScript操作HTML标签时，同样可以使用class属性来找到对应的HTML标签由于class属性并不是唯一的，所以通过CSS或JavaScript对HTML标签的操作会作用域所有具有同名的class属性的标签上。
3).title:
title属性用来对标签内容进行描述说明，当鼠标移动到该标签上面的时候会显示出title属性的值。如下:
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.EpxMzbWHD39VZ-nmL0fs4AHaFj?w=195&h=180&c=7&r=0&o=5&dpr=1.5&pid=1.7"alt="图片存在吗？">4).style:
使用style属性我们可以在html标签内部为标签定义CSS样式，如设置颜色，字体，如下:
<ul>
<li style="color: aquamarine;">此文本的颜色为青色</li>
<li>
<a href="https://www.bilibili.com/" style="color:red;">点击跳转bilibili</a>
</li>
</ul>运行结果如下：
总结:
学习了HTML语法能让我们在写代码的时候更容清晰的找到问题,毕竟在很多时候如果把双标签写成单标签代码是不会有错的，学习了HTML属性可以让我们更好的去设置每个标签的。
555
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
