第113天 标签、class和id选择器三者的区别是什么?分别在什么时候用?
Activity
ghost commentedon Aug 7, 2019
标签选择器选择标签名称,class 选择器选择 class 属性,id 选择器选择 id 属性。
对于 HTML 元素,class 属性可重,语义上代表元素所属的类别;id 属性不可重,语义上代表元素的标识符。
标签选择器的格式为
tagname { ... }
,class 选择器的格式为.class-name { ... }
,id 选择器的格式为#identifier { ... }
。如果想让某种标签的全部元素都具有某种样式(e.g. 去除
<a>
的下划线),就用标签选择器;如果想让特定的一类/一组元素具有某种样式,那么将这些元素加上特定的 class 并使用 class 选择器。如果想让特定一个元素具有某种样式,那么使用 id 选择器。nowherebutup commentedon Aug 7, 2019
id选择器不可重复
LinStan commentedon Aug 7, 2019
标签选择器:
tag{}
选取对应的标签例如 a span divclass选择器:
.class-name{}
选取对应class-name的元素id选择器:
#id-name{}
选取对应id的元素其中id是具有唯一性的。
三者优先级为 id>类>标签
因此一般可以用标签选择器添加该标签的通用样式,类选择器对样式进一步细化,id选择器针对某几个需要特殊处理的元素添加单独的样式。
EragonBubble commentedon Aug 7, 2019
标签选择器: 选择所有相同的dom节点名称的节点,可重复。
ID选择器:选择唯一id的节点,唯一。
类选择器:选择所有相同的类名的节点,可重复。
优先级 id》类》标签
Konata9 commentedon Aug 19, 2019
三者的权重不同,都可以作为 CSS 的选择器使用。id > class > tag。
不过在一般的使用中,
id
会留给 JavaScript 使用,用来进行 DOM 的操作并且id
不允许重复。class
和tag
一般用在 CSS 上,用来进行样式的编辑。