自我评价:走在路上的菜鸟,想着CMS|WEB|SEO,做着可以成为牛掰程序seoer的梦!

当前位置:博客 > 前端开发 > HTML|CSS代码 >

权重和权重的计算

作者:灰牛站长•发布时间:2021-07-12 09:14:02•浏览

基本选择器中标签选择器权重为1,class选择器权重为10,id选择器权重100,通配符选择器*的权重为0-1

后代、子代、交集、并集、相邻兄弟、兄弟的权重为每个单独的选择器的权重相加之和

css权重和基本规则

权重记忆口诀:从0开始,一个行内样式+1000,一个id+100,一个属性选择器/class或者伪类+10,一个元素名,或者伪元素+1

规则:相同的权重,以后面出现的选择器作为最后规则;不同的权重,权重值高则生效

权重大小

!important>id>class>标签>*

  1. 权重不相等的情况下如何比较:谁的权重大听谁的样式
  2. 权重相等的情况:遵循就近原则,下面的会覆盖上面的
  3. 权重相等如何不遵循?使用!important(1000)

相关文章

  • clear的值和特点及伪元素before和after的使用

    clear的值和特点及伪元素before和after的使用

    clear:both的特点 元素需是块级元素 元素不能带有浮动属性 元素必须放在最后一个浮动元素的后面 用户是看不到这个元素的 clearfix清浮动方法的属性 浮动元...
    2021-07-12 11.07.45
  • 文档流和脱离文档流

    文档流和脱离文档流

    文档流:指的是元素排版布局过程中,元素会自动从左往右,从上往下的流式排列。并最 终窗体自上而下分成一行行,并在每行中从左至右的顺序排放元素 每个...
    2021-07-12 11.07.23
  • 让多个元素在一行显示的方法和技巧(面试题)

    让多个元素在一行显示的方法和技巧(面试题)

    如图所示: display: inline div class="text1"文字一/divdiv class="text2"文字二/div .text1,.text2{display: inline;} display: inline-block div class="content1"/divdiv class="content2"/div .conten...
    2021-07-12 10.07.59
  • 雪碧图的使用和制作技巧

    雪碧图的使用和制作技巧

    background-position背景定位 background-position属性设置背景图像的起始位置; xpos ypos第一个值是水平位置,第二个值是垂直。左上角是0。单位可以是长度值px,关键字...
    2021-07-12 10.07.36
  • padding和margin的区别

    padding和margin的区别

    css盒子模型padding和margin的区别 padding是内边距,会影响我们在浏览器中看到的元素的实际大小,内边距会让元素的内容增大,和其他元素没有关系! margin是外边...
    2021-07-12 09.07.09

手机端