🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# CSS选择器 1. 标签/元素选择器 格式: 元素{} 2. 类选择器 格式: .ClassName{} 3. ID选择器 格式: #IDName{} 4. 并集选择器(选择器分组,相当于选择器共用的样式) 格式: 选择器1,选择器2....选择器n{} 5. 交集选择器 格式: 选择条件1选择条件2...选择条件n{} 诸如 p#idtest.classtest 6. 通配符选择器 格式: *{} 7. 派生(后代)元素选择器 格式: 祖先 后代{} 8. 子元素选择器(区别于后代选择器,后代选择器会全选子元素) 格式: 祖先 > 指定后代{} 9. 伪类选择器 格式: 元素:伪类{} 诸如:a:active a:hover 10. 伪元素选择器 格式:元素:伪类{} 诸如:after before 11. 属性选择器 格式: 元素[属性]{} 诸如: p[title] 规则: title=xxx 规定指定的属性值 title^=xx 规定指定的属性值开头通配 title$=xx 规定指定的属性值结尾通配 title*=xx 规定指定的属性值包含通配 12. 子元素的伪类 格式: 子元素:伪类 诸如 :firsr-child last-child nth-child(n) 13. 兄弟元素选择器 格式: 前一个 +/~ 后一个 {} 诸如: span+p{} //span标签后面的第一个p标签 span~p{} //span标签后的所有p标签 14. 否定伪类 格式: 元素:not(选择器) 诸如: p:not(.test) //剔除p标签中class为test的标签 15. 优先级关系 内联样式(1000)>ID(100)>类和伪类(10)>元素选择器(1)>通配符(0)>继承的样式(无) 出现其他的选择器时 需要将优先级相加再计算。相同优先级 后加载的优先。当在样式后添加一个 !importtant 将获得最高优先级