1. 程式人生 > >css選擇器& 選擇器的優先順序

css選擇器& 選擇器的優先順序

一、選擇器

1.元素選擇器 語法,作用給元素名為你設定的那個元素的元素名設定樣式

        元素名 {     

                    樣式列表  

                    }    

2.id選擇器。通過元素的 id 屬性給id賦值, #開始加上id名稱。id名稱在整個頁面裡是唯一的

    id選擇器語法    #id{

                        樣式列表  

                    }  

3.類選擇器  。通過元素的class 屬性 選擇。 一個頁面的class屬性可以相同。

語法 .class名{

                        樣式列表

                    }

4.全部選擇器。 給整個頁面的屬性設定樣式

    語法 *{

                樣式列表            

}

5.並集選擇器 只要滿足下面任意一種選擇器,就給元素設定樣式,選擇器之間用逗號隔開

例如  p,  #a1,.p3{

        樣式列表

            }    

  上面的選擇器的作用就是 給 元素選擇器p ,id選擇器 a1,類選擇器p3.設定樣式

6.交集選擇器 滿足下面所有選擇器才設定樣式,中間什麼都不用隔開 選擇器之間直接粘在一起

p.p3 {

} 這個的意思是 給既是 p元素,並且他的類名稱要等於 p3的p元素設定樣式

二、選擇器的優先順序

    例如 同時兩個選擇器給同一個元素設定相同的屬性,那麼最終設定為哪個呢?這就要按照優先順序來了

    內連樣式 優先順序 1000

    id 選擇器 優先順序 100

    類選擇器 優先順序 10

    元素選擇器 優先順序 1

    統配選擇器 優先順序 0

    繼承的樣式優先順序沒有

 以上的優先順序先滿足高的。

注意:

            1.如果是兩種相同優先順序 為同一個元素 同一個屬性設定 的話,是哪個寫在程式碼靠後 最終就按那個的樣式

            2.交集選擇器的優先順序 所有優先順序 加起來 運算 然後比較

            3.並集的話 就是各算各的。