国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

標簽.類名的權重是多少？

wmui / 2871人閱讀

摘要：在我指出標簽名權重是后，他也覺得自己說錯了。類名標簽，可以解釋為標簽中有此類名的元素。

博客為何而來：今天遇到一個問題：標簽.類名的權重是多少？這個我也不是很清楚，本來想走捷徑：問問別人，百度一下啊……問了一個同學，他開口直接說是20；我問為毛是20，他說標簽名10,類名是10，共計20。在我指出標簽名權重是1后，他也覺得自己說錯了。我百度了一下，也沒有得到什么結果。覺得自己的驗證過程可以寫篇小博客，然后此刻也不是很慢，那我就不拖拉，就是干咯。

類名.標簽，可以解釋為：標簽中有此類名的元素。

大家都知道：

id選擇器的權重加0,1,0,0；

類選擇器、屬性選擇器或偽類的權重加0,0,1,0；

元素和偽元素的權重加0,0,0,1；

元素和偽元素的權重加0,0,0,1；

通配選擇器*對權重沒有貢獻，即0,0,0,0；

最后比較特殊的一個標志!important，它的優先級是最高的，為了方便記憶，可以認為它的權重為1,0,0,0,0；

權重越高，樣式被應用的優先級也就越高，約難被其他樣式覆蓋；

話不多說，計算權重代碼如下：

    
    
    
        
        
        
        標簽.類名的權重是多少？
        
    
    
        

            
標簽.類名的權重是多少?

我計算的方法：通過比較已知的類名權重和層疊樣式表中權重相同的樣式，后面的樣式會覆蓋前面的樣式的樣式，來計算出標簽.類名的權重。放到代碼中具體實現是：通過定義樣式，來改變p標簽的文本顏色，查看瀏覽器渲染結果，來得出權重值；

為了高效計算這個值，我們直接在瀏覽器中調試樣式了。
首先，直接執行上面代碼，結果截圖如下：

分析：我們知道，類名的權重是10，兩個類名疊加權重值為20；而且這個樣式位置在最頂部，添加在同一個標簽上的其他樣式都沒有生效，所以其他的樣式權重都小于20；
其次，直接在瀏覽器中取消已經生效的樣式，看看瀏覽器會渲染哪個樣式，渲染哪個，第二個權重高的樣式可能就是哪個啦，結果截圖如下：

分析：難道這個權重是第二高的嗎？我們知道，同權重的樣式，層疊樣式表中越靠后的會覆蓋前面的，上面代碼中標簽.類名這個樣式是寫在最后，我們可以先換換樣式的位置，再下定論；
接下來，換位置，再執行：
代碼如下：







標簽.類名的權重是多少？



    

        
標簽.類名的權重是多少?

注意：這里的標簽.類名的樣式已經被提到第二的位置了，并且通過前面的操作，我們已經知道標簽.類名的權重小于20，所以我們這里直接把雙類名的權重給注釋掉；

重新執行代碼，運行結果截圖如下：

分析：更換位置之后的結果和上面的結果不符，所以這里是因為靠下的樣式會覆蓋同權重的樣式的緣故。這里也可以得出，（類名 標簽）的權重和（標簽.類名）的權重一樣，也就是11；

小結：標簽.類名的權重是11。

好啦，博客隨著有了結果，也就寫完了，趁著下午天氣不是很熱，磚不燙手，趕緊去搬磚了。

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/52874.html

相關文章

  • 標簽.類名的權重是多少？

    摘要：在我指出標簽名權重是后，他也覺得自己說錯了。類名標簽，可以解釋為標簽中有此類名的元素。 博客為何而來：今天遇到一個問題：標簽.類名的權重是多少？這個我也不是很清楚，本來想走捷徑：問問別人，百度一下啊……問了一個同學，他開口直接說是20；我問為毛是20，他說標簽名10,類名是10，共計20。在我指出標簽名權重是1后，他也覺得自己說錯了。我百度了一下，也沒有得到什么結果。覺得自己的驗證過程...

    stackfing 評論0 收藏0

  • 課時88.權重問題（掌握）

    摘要：什么是優先級的權重作用當多個選擇器混合在以前使用時，我們可以通過計算權重來判斷誰的優先級最高。1.什么是優先級的權重？ 作用：當多個選擇器混合在以前使用時，我們可以通過計算權重來判斷誰的優先級最高。 三個選擇器都是直接選中p標簽 2.權重問題的計算規則 2.1首先先計算選擇器中有多少個id，id多的選擇器優先級最高 2.2如果id的個數一樣，那么再看類名的個數，類名個數多的優先級最高 ....

    cucumber 評論0 收藏0

  • 什么是 CSS？

    摘要：的第二章，什么是釋義，層疊樣式表也算是一種標記語言，其內容作為瀏覽器的輸入，瀏覽器會解析其文本內容，作為附加的樣式信息，用以修飾標簽。年，提出層疊樣式表，的雛形出現。屬性的繼承開篇我們就提到了，為層疊樣式表，層疊代表的意思為屬性的繼承。 前言 作為程序員，技術的落實與鞏固是必要的，因此想到寫個系列，名為 why what or how 每篇文章試圖解釋清楚一個問題。 why what ...

    hankkin 評論0 收藏0

  • css基礎（待補充）

    摘要：選擇器基礎選擇器標簽選擇器針對一類標簽注意選擇的所有，而不是一個。元素元素是文檔結構的基礎。行內元素不會在它本身之前或之后生成分隔符，所以可以出現在另一個元素內容中，而不會破壞其顯示。 css選擇器 基礎選擇器 1.標簽選擇器：針對一類標簽 注意：選擇的所有，而不是一個。 p{ font-size:14px; } css 2.ID選擇器：針對某一個特定的標簽使用，只能使...

    浠ラ箍 評論0 收藏0

  • 【零基礎入門】 css學習筆記（3） 選擇器 與 層疊性

    摘要：，高級選擇器后代選擇器空格表示后代選擇器就是的后代所有的。注意是后代，并不一定是兒子空格可以出現多次補充后代選擇器中出現的東西很靈活，可以是標簽，可以是名，可以是名后代選擇器，就是一種平衡共性特性的平衡。 一，選擇器 1，基礎選擇器 1） 標簽選擇器：div{ } ，選擇的所有，而不是一個，用來描述共性。 2） 類選擇器：.class名{ } 多個元素可以同時屬...

    cppprimer 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<