CSS 都有哪些选择器

派生选择器(用 HTML 标签申明)

id 选择器(用 DOM 的 ID 申明)

类选择器(用一个样式类名申明)

属性选择器(用 DOM 的属性申明,属于 CSS2,IE6 不支持,不常用,不知道就算了)

除了前 3 种基本选择器,还有一些扩展选择器,

包括后代选择器(利用空格间隔,比如 div .a{ })

群组选择器(利用逗号间隔,比如 p,div,#a{ }) 那么问题来了,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) * 可继承: font-size font-family color, UL LI DL DD DT; * 不可继承 :border padding margin width height ; * 优先级就近原则,样式定义最近者为准; * 载入样式以最后载入的定位为准; 优先级为: !important > id > class > tag important 比 内联优先级高 CSS3 新增伪类举例: p:first-of-type 选择属于其父元素的首个

元素的每个

元素。 p:last-of-type 选择属于其父元素的最后

元素的每个

元素。 p:only-of-type 选择属于其父元素唯一的

元素的每个

元素。 p:only-child 选择属于其父元素的唯一子元素的每个

元素。 p:nth-child(2) 选择属于其父元素的第二个子元素的每个

元素。 :enabled、:disabled 控制表单控件的禁用状态。 :checked,单选框或复选框被选中。 

原文地址:https://www.cnblogs.com/wangyongguo/p/6703438.html