4.CSS Selector

1.标签选择器 =》映射标签

2.类选择器 =》通过. 找到对应的class值

3.id选择器 =》 通过#找到对应的id

4.并列选择器 =》 类似于 或   =》多个标签 可能有相同的样式,把多个标签相同的样式写到一起, 用的相对较少  =》 div,p

5.复合选择器 =》 类似于 与  =》

6.后代选择器 =》一个div又有一个p标签 中又有一个p标签  =》 div p div

7.直接后代选择器 =》 div > p

8.相邻兄弟选择器 =》 div + p   =>跟div相邻的p标签

9.属性选择器 =》div[name] => 找到div中属性为name的标签 

   =>div[name][age] =>找到div中属性为name和age的标签

   =>div[name="jack"] =>找到div中属性name=“jack”的标签

10.伪类: hover / focus 

11.选择器的优先级:

如果在相同选择器:

1.叠加  就近原则

不同的选择器:

选择器的针对性越小,他的优先级就越高;

选择器的weight; 标签 1 / 类选择器 10 / 属性 10 / 伪类 10  / id 100 / 101

优先级排行:

important 》内联 》id》类》标签 |伪类 |属性 》伪元素》通配符》继承

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 136,084评论 19 139
  • 国家电网公司企业标准(Q/GDW)- 面向对象的用电信息数据交换协议 - 报批稿:20170802 前言: 排版 ...
    庭说阅读 14,022评论 6 13
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,693评论 1 92
  • 日课39:最好的人生状态——在热爱的领域努力地玩,以及如何让自己保持这种状态的三叶草模型,谈谈你的理解。 参考书目...
    Leice阅读 3,550评论 0 1
  • 昨天试听课后,那位新初一的孩子S选择以后再考虑上,我们有缘再见。 今天的主题是:如何编织知识网?主要是介绍两款软件...
    思教查理阅读 2,600评论 0 0

友情链接更多精彩内容