在網站建置過程中,css是控制網頁樣式的重要屬性。那麼這篇文章就為大家總結介紹關於css 類別選擇器及css優先順序高低排列的相關知識。
首先介紹css選擇器種類有哪些:
一、標籤名選擇器
根據指定的標籤名,在目前介面中找到所有該名稱的標籤,然後設定屬性。
標籤選擇器選定的是目前介面中所有該名稱的標籤,而不能單獨選定某一標籤; 標籤選擇器無論標籤藏得多深都能找到;只要是HTML中的標籤都可以作為標籤選擇器。
二、類別選擇器
根據指定的類別名稱找到對應的標籤,然後設定屬性。
每一個HTML標籤都有class屬性,也就是說每個標籤都可以設定class;在同一個介面中class是不可重複的;寫id選擇器的時候class前一定要加. ;類別名稱的命名規範和id命名規範是一樣的;類別名稱就是專門為某個特定的標籤設定樣式的;在HTML中每個標籤都可以同時綁定多個類別名稱。
三、ID選擇器。
根據指定的id名稱找到對應的標籤,然後設定屬性。
每一個HTML標籤都有id屬性,也就是說每個標籤都可以設定id;在同一個介面中id是不可重複的;在寫id選擇器的時候id前一定要加# ; id的名稱是有一定的規範的。 id的名稱只能有字母、數字、底線組成;不能以數字開頭;不能是關鍵字;在企業開發中一般如果僅僅是為了設定樣式,我們不會使用id,應為id是為了給js使用的。
css優先權高低排列怎麼分割的?
一般而言,選擇器越特殊,它的優先權越高。也就是選擇器指向的越準確,它的優先權就越高。
通常我們用1表示標籤名選擇器的優先級,用10表示類別選擇器的優先級,用100標示ID選擇器的優先權。
例如上例當中 .polaris span {color:red;}的選擇器優先權是 10 1 也就是11;而 .polaris 的優先權是10;瀏覽器自然會顯示紅色的字。了解這個道理之後下面的優先權計算自是易如反掌:
div.test1 .span var 優先權 1 10 10 1
span#xxx .songs li 優先權 1 100
#span#xxx .songs li 優先權 1 100#span#xxx .songs li 優先權 1 100
#xxx li 優先權 100 1
對於何種情況下使用何種選擇器,用不同選擇器的原則是:
第一:準確的選到要控制的標籤;
第二:使用最合理優先順序的選擇器;
第三:HTML和CSS程式碼盡量簡潔美觀。
以上是css選擇器優先權怎麼區別規定的?的詳細內容。更多資訊請關注PHP中文網其他相關文章!