id和class是HTML元素中两个最基本的公共属性。下面我们向大家介绍html的id属性和class属性
1、html 标签id属性
id属性被赋予了标识页面元素的唯一身份。如果一个页面出现了多个相同id属性取值，CSS选择器或者 就会因为无法分辨要控制的元素而最终报错。
id属性实例：
<!DOCTYPE html>
<html ns=\"http://www.w3.org/1999/xhtml\">
<head>
< ></ >
< href=\"css/css_reset.css\" rel=\"stylesheet\" type=\"text/css\" />
</head>
<body>
<div id=\"first\">码农教程</div>
<p id=\"first\">码农教程</p>
</body>
</html>
上面HTML代码是错误的，因为在同一个HTML页面中，不允许出现两个相同的id。不过要注意一下，在不同页面是可以出现相同id的元素。
2、html 标签class属性
class，顾名思义，就是“类”。它采用的思想跟其他C、Java等编程语言的“类”相似。我们可以为同一个页面的相同元素或者不同元素设置相同的class，然后使得相同的class具有相同的CSS样式。
如果你要为两个元素或者两个以上元素定义相同的样式，建议使用class属性。
class属性实例
<!DOCTYPE html>
<html ns=\"http://www.w3.org/1999/xhtml\">
<head>
< ></ >
< href=\"css/css_reset.css\" rel=\"stylesheet\" type=\"text/css\" />
</head>
<body>
<div class=\"first\">码农教程</div>
<p class=\"first\">码农教程</p>
</body>
</html>
这段HTML代码是正确的，因为在同一个HTML页面中，允许相同的元素或者不同的元素设置相同的class属性，以便我们可以统一对具有相同的class属性的元素定义相同的CSS样式。
id和class就像你的身份证号和姓名，身份证号是全国唯一的，id号也就是唯一的，class（类名）就是姓名，两个人的姓名就有可能一样。
此外，需要注意一下：
- （1）一个标签可以同时定义多个class；
- （2）id也可以写成name，区别在于name是HTML中的标准，而id是XHTML中的标准，现在网页的标准都是使用id，所以大家尽量不要用name属性；
继续阅读与本文标签相同的文章
-
城市数字化后，新一代内生安全系统可全方位保护
2026-05-14栏目： 教程
-
谷歌也来“唱衰”5G，5G手机只会徒增功耗？为何这么说？
2026-05-14栏目： 教程
-
量子信息和量子技术白皮书合肥宣言在中科大发布
2026-05-14栏目： 教程
-
微信悄悄更新一新功能，来看看！
2026-05-14栏目： 教程
-
打破三大运营商垄断，第四大运营商终于来了！
2026-05-14栏目： 教程