css的特性

來源:互聯網
上載者:User

標籤:結合   order   特定   lin   html   col   代碼   選取器   over   

一、繼承性:

  繼承是一種規則,它允許樣式不僅應用於某個特定html標籤元素,而且應用於其後代。

/* 不具有繼承性的css樣式: */
p{border:1px solid red;}



 

二、特殊性(優先順序?)

  定位一個元素,選取器的特殊性值則是決定哪一個勝出的關鍵。 其形式(不在代碼中體現)如:0,0,0,1/1,1,0,1/0,0,0,3/….

  主要有四個規則:

  1. 用了ID ,則 +0,1,0,0;
  2. 用class、屬性(如[id=”btn1”])、偽類(如:hover) +0,0,1,0;
  3. 元素和虛擬元素(如::before) 加0,0,0,1;
  4. 結合符對特殊性沒有貢獻,而萬用字元的貢獻是0,0,0,0.(所以他們對總特殊性沒有影響);

  幾個例子:

p{font-style: normal} /* 0,0,0,1 */body div p{font-style:italic} /* 0,0,0,3 */(winner)html > body table tr[id="totals"] td ul > li{color:maroon;} /* 0,0,1,7 */li#answer {color: navy} /* 0,1,0,1 /* (winner)

  

  題外話:css中 內聯樣式(直接寫在標籤中的) >  內建樣式(寫在<head></head>中的)  >    外部樣式(<link></link>匯入的)

 

三、層疊

  後面的樣式會覆蓋前面的樣式

  

四、總結

  內聯樣式>id>class;  

  如果特殊性相同,後定義的規則優先;

css的特性

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.