CSS繼承、層疊、優先權

一、CSS繼承

1.子元素繼承父元素的部分樣式

2.可以通過inherited:yes來判斷屬性是否繼承

3.CSS常見繼承樣式:

     一般樣式繼承只繼承文字大小、粗細、顏色、字體等屬性

   1)字體系列屬性

       font:組合字體;

       font-family:規則元素字體系列;

       font-weight:設置字體的粗細;

      font-style:設置字體的風格;

      font-variant:設置小型大寫字母的字體顯示文本,這意味着所有的小寫字母均會被轉換爲大寫,但是所有使用小型大寫字體的字母與其餘文本相比,其字體尺寸更小。

    2)文本系列屬性

      text-indent:文本縮進;

      text-align:文本水平對齊;

      line-height:行高;

       word-spacing:增加或減少單詞間的空白(即字間距);

      letter-spacing:增加或減少字符間的空白(即單詞間距);

      text-transform:控制文本大小寫;

      direction:規定文本的書寫方向;

      color:文本顏色;

      3)元素可見性

      visibility:元素可見性。

     4)表格佈局屬性

        caption-side、border-collapse、border-spacing、empty-cells、table-layout

      5)列表佈局屬性

      list-style-type、list-style-image、list-style-position、list-style

     6)生成內容屬性

      quotes

    7)光標屬性:cursor

    8)頁面樣式屬性:page、page-break-inside、windows、orphans

4.所有元素可以繼承的屬性

     1)元素可見性:visibility

      2)光標屬性:sursor

5.內聯元素可以繼承的屬性

     1)字體系列屬性

      2)除text-indent、text-align之外的文本系列屬性

6.塊級元素可以繼承的屬性

      text-indent、text-align

7繼承的好處:父元素設置樣式,子元素直接繼承,可減少CSS代碼

參考blog:https://www.cnblogs.com/duhuo/p/8018756.html

二、層疊

     不衝突時疊加、衝突時算權重、權重一樣就近

 三、優先級

    1. CSS選擇器優先級: ID選擇器>類選擇器>標籤選擇器>通配選擇器

     2.個人理解是  

         1) 1個ID選擇器=1個ID選擇器

          2)1個ID選擇器>無數個類選擇器

           後面依此類推 ,混合使用時權重相加,權重大的樣式就優先顯示,權重相等的樣式就近顯示

 

 

 

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章