2. 程式人生 > >CSS選擇器優先順序以及權重

CSS選擇器優先順序以及權重

阿新 • • 發佈：2018-12-25

1.優先順序：!important > 行間樣式 > id選擇器>class選擇器=屬性選擇器>標籤選擇器>*萬用字元選擇器
2.權重：

!important            Infinity
行間樣式               1000
id                           100
class|屬性|偽類       10
標籤|偽元素              1
萬用字元                       0

後面的數字為256進位制

相關推薦

CSS選擇器優先順序以及權重

1.優先順序：!important > 行間樣式 > id選擇器>class選擇器=屬性選擇器>標籤選擇器>*萬用字元選擇器2.權重： !important            Infinity 行間樣式               1000

css選擇器優先順序及權重計算

一、優先順序分類 通常可以將css的優先順序由高到低分為6組： 第一優先順序：無條件優先的屬性只需要在屬性後面使用！important。它會覆蓋頁面內任何位置定義的元素樣式。ie6不支援該屬性。第二優先順序：在html中給元素標籤加style，即內聯樣式。該方法會造成cs

css選擇器優先順序計算以及偽元素與偽類區別

1.      行內（寫在html的style屬性中）樣式>ID選擇器>類（class），偽類（：hover等）選擇>元素名（div）和偽元素（：after）選擇器    權重                  1000                  

CSS 選擇器優先順序

1. CSS選擇器判斷過程： 第一步：判斷選擇器的權重(多重組合樣式同理，多個class<一個id); 權重從大到小依次為: !import 元素行內樣式 ID選擇器 偽類選擇器/屬性選擇器>類選擇器 tag標籤選擇器 *萬用字元 繼承 第二步: 同種型別的

深入理解CSS選擇器優先順序

什麼是選擇器優先順序（Specificity） 直接複製了 MDN對優先順序的定義 上的解釋： 瀏覽器通過優先順序來判斷哪一些屬性值與一個元素最為相關，從而在該元素上應用這些屬性值。優先順序是基於不同種類選擇器組成的匹配規則。 這句話也是很抽象，暫且先不管它了。但是我們可以先看一個例子：

CSS選擇器優先順序比較

CSS選擇器中比較常見的有標籤選擇器、ID選擇器、類選擇器以及子選擇器。而事實上，CSS選擇器如果細分下來，竟然多達40多種。   那麼當我們在碰到通過多種形式對同一個元素進行設定樣式時的情況時，如果不進行測試，如何預測其最終結果呢？   以下是選擇器

CSS選擇器-優先順序-效能

         首先說下曾經踩過的坑,p:nth-child(1)      匹配的是任何元素的第一子元素p ,(之前把它理解成p下的一個元素)                                              p:nth-of-type(1)  

css —— 選擇器優先順序及jQuery遍歷元素常用方法

一、部分常用css選擇器 1、子元素選擇器：> 作用：只選取直接子元素。 優點：使html元素層次很清晰的呈現。 2、相鄰兄弟元素選擇器：+ 作用：選取相鄰兄弟元素中的第二個。適用於兄弟元素(可以是不同元素)第一個與後面的(某個或所有)樣式不一樣的場合。 例： &l

CSS選擇器優先順序與效率優化

各類選擇器的優先順序 important宣告 1,0,0,0ID選擇器 0,1,0,0類選擇器 0,0,1,0偽類選擇器 0,0,1,0屬性選擇器 0,0,1,0標籤選擇器 0,0,0,1偽元素選擇器 0,0,0,1萬用字元選擇器 0,0,0,0 在上面的選擇器中，此外，

css選擇器優先順序

!important > 行內樣式>ID選擇器 > 類選擇器 > 標籤 > 萬用字元 > 繼承 > 瀏覽器預設屬性 同一級別中後寫的會覆蓋先寫的樣式 內聯樣式表的權值為 1000 ID 選擇器的權值為 100 Class 類選

CSS 選擇器優先順序【6種】

CSS 選擇器優先順序【6種】 由高到低為: 1，！important  無條件優先； 2，  html標籤內的； 3，#id{...}   通過id的; 4, .className{

CSS選擇器彙總以及除錯DEMO

大部分資訊來自於BAIDU，部分資訊自己新增。 CSS選擇器 樣式表呼叫一般情況下包含如下兩種： 頁面內嵌法： 就是將樣式表直接寫在頁面程式碼的head區。類似這樣： <style type="text/css">body { background : whi

【CSS】CSS選擇器優先順序及!important屬性

  CSS的選擇器是有權重的，當不同選擇器的樣式設定有衝突時，會採用權重高的選擇器設定樣式。權重（即優先順序）的規則如下，權重越高，優先順序越高：   同一個元素可以使用多個規則來指定它的同一樣式（

css選擇器優先順序判定

CSS selector 優先順序 理解1： 如何確定CSS的優先順序？這裡我們要先引入一個機制， 分別用4個數字（a，b，c，d）表示優先順序組合，比如1，1，1，1和0，1，0，1。它們的意思分別

CSS選擇器優先順序 jquery選擇器優先順序

css選擇器主要分為三類:標籤名選擇器、類選擇器、ID選擇器。當然後續還擴充套件了一些後代選擇器和群組選擇器。  一、 下面對著5中選擇器進行舉例：         1. 標籤名選擇器     div

CSS選擇器特殊性（權重）計演算法則

特殊性計算規則        為了計算規則的特殊性，給每個選擇器都分配一個數字值。然後，講規則的每個選擇器的值加在一起，計算出規則的特殊性。一般情況下，如果一個特定選擇器中的選擇器數量少於10個，可以以10 為基數計算特殊性。        選擇器的特殊性分

完整css選擇器總結與優先順序權重

css的選擇器，在前端開發中只是很小的一部分，但其重要性卻不可忽略。因為其比較繁瑣。在看了很多書籍和文章後。我發現選擇器的組織真的很混亂，沒有找到一個完整的總結。不敢保證我的是否是最完整的，但我已竭盡所能。話不多說，直接看下文：  1.萬用字元選擇器：*{    

CSS 選擇器權重優先順序計算規則

CSS有兩大特性，繼承性和層疊性  層疊性指的是：權重相同的情況下，後寫的覆蓋前面的樣式。 由此可見，層疊性和選擇器的權重有很大關係，今天就著重說一下選擇器的權重  選擇器有兩大類： 基礎選擇器：id選擇器，類選擇器，標籤選擇器，萬用字元選擇器；   複合選擇器：後代選

CSS選擇器的權重及優先順序

最近在牛客網上刷題遇到過各類選擇器優先順序的比較問題，經查閱，現總結如下：總體來說：內聯樣式 > id>class=屬性選擇器=偽類選擇器=偽元素選擇器>標籤，大致分為四個等級：一等：

【CSS 學習】CSS 選擇器、選擇器的優先順序和權重

基本選擇器選擇器名 稱實 例描 述版 本*通用選擇器（Universal selectors）*匹配所有的元素2.1E標籤選擇器（Type selectors）p匹配所有的 <p>1.class類選擇器（Class selectors）.nav匹配所有 class