站长交易首选担保平台!
日期: 2019-12-09 11:13:54 人气: -
id和class是HTML元素中两个最基本的公共属性。
一、元素的id属性
id属性被赋予了标识页面元素的唯一身份。如果一个页面出现了多个相同id属性取值，CSS选择器或者JavaScript就会因为无法分辨要控制的元素而最终报错。
举例：
1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link 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的元素。
二、元素的class属性
class，顾名思义，就是“类”。它采用的思想跟其他C、Java等编程语言的“类”相似。我们可以为同一个页面的相同元素或者不同元素设置相同的class，然后使得相同的class具有相同的CSS样式。
如果你要为两个元素或者两个以上元素定义相同的样式，建议使用class属性。
举例：
1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link 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属性；
