1.選擇器的作用
規範了頁面中哪些元素能夠使用定義好的樣式,選擇器就是乙個條件,符合這個條件的元素,都可以使用定義好的樣式2.選擇器的詳解
①通用選擇器*所有元素都要匹配這個樣式
盡量少用, 因為效率非常低
css reset 樣式重置.由於不同瀏覽器對同一篇**的解析有可能不同,需要把一些樣式進行統一,或者清除.這種行為就叫做css reset
②標籤選擇器,元素選擇器一般用於定義某種元素的共用樣式
元素名稱
頁面中所有對應元素,都要應用這個樣式
③id選擇器只對當前頁面中,乙個標籤生效
一般專案中id選擇器,單獨使用比較少,
專案中#id選擇器通常用於後代和自帶選擇器的第一部分
#p1
④類選擇器定義頁面上的乙個樣式片段,哪個元素要用,就是用class呼叫,可以不停的被呼叫
.類名宣告類名有點
呼叫類名沒有點
類選擇器的特殊使用方式
1.多類選擇器,乙個class,引用多個類名
類選擇器
2.分類選擇器
①標籤選擇器.類選擇器
呼叫這個類名的這個標籤,應用這個樣式,提公升權值
② .類選擇器 .類選擇器
同時引用了這兩個類選擇器的標籤,應用這個樣式
注意,類名的定義規則
1.定義類選擇的時候,點不能省略
2.類名不能以數字開頭
3.只能包含-_
4.見名知意
⑤.群組選擇器選擇器1,選擇器2,選擇器3,選擇器4…
⑥.後代選擇器元素的後代關係,匹配元素
後代關係,一級或者多於一級的巢狀
選擇器1 選擇器2 選擇器3…
⑦.子代選擇器通過元素的子代關係,匹配元素
子代關係,一級的巢狀
選擇器1>選擇器2>選擇器3…
後代選擇器和子代選擇器可以混寫
比如 #d1 p>span{} #d1 >p span{}
⑧.偽類選擇器匹配元素不同狀態下的樣式
1.鏈結未被訪問時的狀態
:link
2.鏈結已訪問的狀態
:visited
3.滑鼠懸停時的狀態
:hover
4.元素被啟用時的狀態
:active
5.元素獲取焦點時的狀態
::focus
⑨選擇器權值問題!important >1000
內聯樣式 1000
id選擇器 100
類選擇器 10
偽類選擇器 10
元素選擇器 1
通用選擇器* 0
繼承的樣式 無
權值:表示當前選擇器的重要程度,權值越大優先順序越高
特點:1.當乙個選擇器中含有多個選擇器時,需要將所有選擇器的權值進行相加,結果越大優先順序越高
2.權值相同,使用就近原則
3.群組選擇器權值不能相加,單獨計算
4.樣式後面新增了!important 直接獲得最高權值,內聯樣式不能新增!important
權值計算結果不能超這個權值的最大數量級(一百個1相加,也比10小)
基礎選擇器 復合選擇器
1 標籤選擇器 元素選擇器 標籤選擇器是指用html標籤名稱作為選擇器,按標籤名稱分類,為頁面中某一類標籤指定統一的css樣式。其基本語法格式如下 標籤名 或者 元素名 2 類選擇器 類選擇器使用 英文點號 進行標識,後面緊跟類名,其基本語法格式如下 類名標籤呼叫的時候用class 類名 即可。1....
CSS基礎選擇器 類選擇器 id選擇器
選擇器的作用 根據不同的需求把不同的標籤選出來 是由單個選擇器組成的 包括 標籤選擇器 類選擇器 id選擇器 萬用字元選擇器 1 標籤選擇器 指用html標籤名稱作為選擇器,按標籤名稱分類,為頁面中某一類標籤指定統一的css樣式。優點 能夠快速為頁面中同型別的標籤統一設定樣式。缺點 不能設計差異化樣...
CSS選擇器之基礎選擇器
選擇器 選擇符 就是根據不同需求把不同的標籤選出來這就是選擇器的作用。簡單來說,就是選擇標籤用的。標籤選擇器 又稱元素選擇器,指用html標籤作為選擇器,為頁面中某類標籤設定css樣式。缺點 不能差異化設定樣式,只能選擇全部的當前標籤。語法 基礎選擇器之標籤選擇器title 標籤選擇器 寫上標籤名 ...