首页 腾讯云动态正文

【腾讯】简述下 css specificity

云返利网 腾讯云动态 2020-08-21 20:45:04 5 0 腾讯云服务
大运河和安康圣母圣殿,意大利威尼斯
(© Jim Richardson/Offset by Shutterstock)

本题摘自于我 github 上的面试每日一题:https://github.com/shfshanyue/Daily-Question,并有大厂面经及内推信息,可「在左下角打开本题原文链接」

css specificity 即 css 中关于选择器的权重,以下三种类型的选择器依次下降

  1. id 选择器,如 #app
  2. classattributepseudo-classes 选择器,如 .header[type="radio"]:hover
  3. type 标签选择器,如 h1p

其中通配符选择器 *,组合选择器 + ~ >,否定伪类选择器 :not() 对优先级无影响

另有内联样式 <div class="foo" style="color: red;"></div>!important(最高) 具有更高的权重

:not 的优先级影响 - codepen 可以看出 :not 对选择器的优先级无任何影响

更多面试

【字节-视频架构组-前端】头条架构组招人了内含自测题 【美团】什么是防抖和节流,他们的应用场景有哪些 【美团】如何获取一个进程的内存并监控

关注我

我是山月,正致力于「每天用五分钟能够看完的简短答案回答一个大厂高频面试题」。扫码添加我的微信,备注进群,加入高级前端进阶群.

加我微信拉你进入面试交流群

欢迎关注公众号【互联网大厂招聘】,定时推送大厂内推信息及面试题简答,每天学习五分钟,半年进入大厂中

每天五分钟,半年大厂中

本文分享自微信公众号 - 互联网大厂招聘(gh_5f162937a2ad)。
如有侵权,请联系 support@oschina.cn 删除。
本文参与“”,欢迎正在阅读的你也加入,一起分享。

【关于云返利网】

云返利网是阿里云、腾讯云、华为云产品推广返利平台,在各个品牌云产品官网优惠活动之外,云返利网还提供返利。您可以无门槛获得阿里云、华为云、腾讯云所有产品返利,在官网下单后就可以领取,无论是自己用、公司用还是帮客户采购,您个人都可以获得返利。云返利网的目标是让返利更多、更快、更简单!详情咨询13121395187(微信同号)