css样式有哪几种选择器
4个回答
展开全部
CSS选择器、优先级与匹配原理
1.id 选择器(#myid)2.类选择器(.myclassname)3.标签选择器(div,h1,p)4.相邻选择器(h1+p)5.子选择器(ul < li)6.后代选择器(li a)7.通配符选择器(*)8.属性选择器(a[rel="external"])9.伪类选择器(a:hover,li:nth-child)
其中ID选择器的效率是最高,而伪类选择器的效率则是最低
CSS的权重
1. 通配选择符的权值 0,0,0,0
2. 标签的权值为 0,0,0,1
3. 类的权值为 0,0,1,0
4. 属性选择的权值为 0,0,1,0
5. 伪类选择的权值为 0,0,1,0
6. 伪对象选择的权值为 0,0,0,1
7. ID的权值为 0,1,0,0
8. important的权值为最高 1,0,0,0
使用规则: 选择器的权值加到一起,大的优先;如果权值相同,后定义的优先 。
从上面我们可以得出两个关键的因素:
1. 权值的大小跟选择器的类型和数量有关
2. 样式的优先级跟样式的定义顺序有关
1.id 选择器(#myid)2.类选择器(.myclassname)3.标签选择器(div,h1,p)4.相邻选择器(h1+p)5.子选择器(ul < li)6.后代选择器(li a)7.通配符选择器(*)8.属性选择器(a[rel="external"])9.伪类选择器(a:hover,li:nth-child)
其中ID选择器的效率是最高,而伪类选择器的效率则是最低
CSS的权重
1. 通配选择符的权值 0,0,0,0
2. 标签的权值为 0,0,0,1
3. 类的权值为 0,0,1,0
4. 属性选择的权值为 0,0,1,0
5. 伪类选择的权值为 0,0,1,0
6. 伪对象选择的权值为 0,0,0,1
7. ID的权值为 0,1,0,0
8. important的权值为最高 1,0,0,0
使用规则: 选择器的权值加到一起,大的优先;如果权值相同,后定义的优先 。
从上面我们可以得出两个关键的因素:
1. 权值的大小跟选择器的类型和数量有关
2. 样式的优先级跟样式的定义顺序有关
展开全部
基本的是三类:
id选择器:
#id-name { color:red }
class选择器:
.class-name { color:red }
标签选择器:
li { color:red }
相互之间又可以进行各种组合:
后代选择器:
.class-name ul li { float:left}
子代选择器:
.class-name>cld-name { color:red }
群组选择器:
#id-name, .class-name, div { font:400 12px/12px arial }
伪类选择器:
class-name:hover{ color:red }
属性选择器:
input[type=text] {backgroun:#ccc}
.class-name [class *="na"]{vertical-align:middle}
id选择器:
#id-name { color:red }
class选择器:
.class-name { color:red }
标签选择器:
li { color:red }
相互之间又可以进行各种组合:
后代选择器:
.class-name ul li { float:left}
子代选择器:
.class-name>cld-name { color:red }
群组选择器:
#id-name, .class-name, div { font:400 12px/12px arial }
伪类选择器:
class-name:hover{ color:red }
属性选择器:
input[type=text] {backgroun:#ccc}
.class-name [class *="na"]{vertical-align:middle}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
ID选择器,类选择器,下代选择器,子代选择器,伪类选择器等:
#content;
.content;
.content a;
.content>a;
.content:first-child
#content;
.content;
.content a;
.content>a;
.content:first-child
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
实在是太多了,不能一个一个的给你举例了,发个网址给你,你进去看下吧,在这里你会得到更多你想了解的;
http://www.w3school.com.cn/cssref/css_selectors.asp
http://www.w3school.com.cn/cssref/css_selectors.asp
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询