css中常見的基本選擇器


  首先,什么是選擇器?選擇器就是通過標簽選擇一類元素進行控制,常用於HTML等語言中。

  css中的選擇器種類有很多,下面介紹的是幾種常見的基本選擇器:通配符選擇器,類選擇器,ID選擇器,標簽選擇器,后代選擇器,子代選擇器,屬性選擇器。

當多個選擇器同時對同一塊內容進行編輯時使用那種選擇器呢?這就引出了另一個概念:權重。權重越高,樣式就會被優先使用。

<!--權重,權值: 行內1000  ID100 class10 標簽1 -->

  1. 通配符選擇器,用“ * ”來表示,用來選中所有元素,但在企業開發中一般不會使用通配符選擇器,而有些表單、新聞詳情這類簡單、干凈、一致的頁面會有全局設置,目的就是看起來簡潔、整齊。

                            

  2.類選擇器,用“ . ”來表示,用來獨立規范HTML中的一類元素,該選擇器可以單獨使用,也可以與其他元素結合使用,是比較常用的選擇器之一。
               單獨使用時:如果你想讓aaa類元素的背景為粉紅色,你就可以這樣設置:

                          

 

                 和其它元素結合使用:   p.important 解釋為:“其 class 屬性值為 important 的所有段落”。 但如果此段落中有一個h1元素,因為h1 元素不是段落,這個規則的選擇器就與之不匹配,因此 h1 元素不會變成紅色文本。

                              

 

  3.ID選擇器,用“ # ”表示,id 選擇器可以為標有特定 id 的 HTML 元素指定特定的樣式。

ID選擇器有以下幾點需要注意:

一.   ID,就像你的QQ號一樣,是唯一的,每個ID選擇器的名不能重復,但是class類名可以重復。

二.   id選擇器不能像類選擇器一樣多個合並使用,一個元素只能命名一個id名。

三.   可以在不同文檔中使用同一個ID名,但前提是每個文檔中不能有重復的ID名。

                   

 

    4.標簽選擇器,標簽選擇器又叫元素選擇器:文檔的元素就是最基本的選擇器。

    例如:使li標簽的字體顏色變為紅色。

      

 

  5.后代選擇器,注意與子代選擇器區分,兩者非常類似。

   就好像是一個輩分問題,給類名為nav元素里的a元素設定格式

  

 

   6.子代選擇器,給類名為nav元素里符合子元素的a元素設定格式。

  

 

  7.可以為擁有指定屬性的 HTML 元素設置樣式;屬性選擇器通過 [] 來定義,[] 內部為元素的屬性。

                                    id和類本質上就是精確屬性值選擇器,

 

 

 

 

                 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM