首页 > 代码库 > 8_选择器
8_选择器
一、
css selector (选择器,选择符)
1. id selector 通过查找具有某个id属性的元素来添加样式
id = "idName"
#idName {
样式……
}
*注意:同一个页面中id不能重名
2. tag selector(类型选择器,标签选择器,元素选择器) 通过标签的名字找到某一类型标签添加样式
tagName {
样式……
}
3. class selector(类选择器) 通过查找具有某类class属性的元素来添加样式
class = "className" .className { }
*注意: 1) class可以重复调用
2) 元素可以具有多个className,每个名字中间以空格隔开,每个名字添加的样式,元素都会识别
4.* 通配符 (通配选择器),代表所有的元素 (不推荐使用)
5.包含选择器 (后代选择器)
如:
a:hover span {
color: yellow;
}
#box span {
}
找到box中包含的span标签
1. 层级数目不要过多 一般不超过三层
2. 子级是id话,一般不用包含选择器
3. 包含选择器的优先级是其中用到的所有选择器的累加
二、
元素可以同时使用多种选择器,每种选择器添加的样式,元素都会识别
当我们在不同的选择器中,添加了同一条样式,这种情况下,元素最终显示
那个选择器下的样式,我们就叫做这个选择器的优先级高
选择器优先级一致的情况下,后边的覆盖前边的
id选择器的优先级高于class
class选择器的优先级高于tag选择器
tag选择器的优先级高于*
style 行间样式优先级最高
style > id > class > tag > *
三、inherit 继承
父级的这条样式是怎样的元素的这条样式就是怎样的
文本样式,自己没有设置这条样式,就会继承父级,如果子元素设置就显示子元素自己的样式
文本样式,子极会继承父级
一、
css selector (选择器,选择符)
1. id selector 通过查找具有某个id属性的元素来添加样式
id = "idName"
#idName {
样式……
}
** 同一个页面中id不能重名
2. tag selector(类型选择器,标签选择器,元素选择器) 通过标签的名字找到某一类型标签添加样式
tagName {
样式……
}
3. class selector(类选择器) 通过查找具有某类class属性的元素来添加样式
class = "className"
.className {
}
** 1) class可以重复调用
2) 元素可以具有多个className,每个名字中间以空格隔开,每个名字添加的样式,元素都会识别
4. * 通配符 (通配选择器),代表所有的元素 (不推荐使用)
二、
元素可以同时使用多种选择器,每种选择器添加的样式,元素都会识别
当我们在不同的选择器中,添加了同一条样式,这种情况下,元素最终显示
那个选择器下的样式,我们就叫做这个选择器的优先级高
id选择器的优先级高于class
class选择器的优先级高于tag选择器
tag选择器的优先级高于*
style 行间样式优先级最高
style > id > class > tag > *
三、
inherit 继承
父级的这条样式是怎样的元素的这条样式就是怎样的
文本样式,自己没有设置这条样式,就会继承父级,如果子元素设置就显示子元素自己的样式
文本样式,子极会继承父级
inherit 继承 父级的这条样式是怎样的元素的这条样式就是怎样的
选择器优先级一致的情况下,后边的覆盖前边的
8_选择器