• 补充拓展:CSS权重值叠加


     都知道CSS选择器有权重优先级,权重大的优先展示。

     但部分人可能不清楚,权重值也是可以叠加计算的

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title>element</title>
            <style>
                .classArea{
                     100px;
                    height: 100px;
                    background: red;
                }
                #idArea{
                    background: yellow;
                }
                div#idArea{
                    background: pink;
                }
            </style>
        </head>
        <body>
            <div class="classArea" id="idArea"></div>
        </body>
    </html>

     分析:

    view{ // 权重为 1
      color: blue
    }
    
    .ele{ // 权重为 10
      color: red
    }
    
    #ele{ // 权重为 100
      color: pink
    }
    
    view#ele{ // 权重为 1 + 100 = 101,优先级最高,元素颜色为orange
      color: orange
    }
    
    view.ele{ // 权重为 1 + 10 = 11
      color: green
    }

    .

  • 相关阅读:
    装饰器和表达生成式
    函数
    字符编码
    函数基础
    列表,字典与集合
    Linux Semaphore
    tp5安装easyWeChat
    wx.request
    小程序设计规范
    小程序的概念和特点
  • 原文地址:https://www.cnblogs.com/fightjianxian/p/11121021.html
Copyright © 2020-2023  润新知