標籤選擇器
比如: div 表示頁面內所有的div中的文字的顏色都會變成黑色。
classname選擇器
比如 .class 表示當前根目錄下的所有classname為class的標籤中的文字都是黑色,其他目錄建議一層一層的寫。
id選擇器
比如 #class 表示當前頁面所有id為 class的標籤的文字顏色為黑色。
css後代選擇器(名稱為w3school所複製,感謝)
比如.class span表示標籤class為class中的所有span標籤的文字顏色為黑色
子元素選擇器(名稱為w3school所複製,感謝)
h1 > span表示根目錄下第乙個h1標籤中的span標籤字型顏色變成黑色,其他不變。
相鄰兄弟選擇器(名稱為w3school所複製,感謝)
li+li
這樣的效果ul中除了第乙個li其他的li中的字型顏色都是黑色,因為用這個選擇器的結合符,只能選擇第二個元素,所以以此類推,除了第乙個其他的都沒問題。
[id*=div]
[id^=div]
[id$=div]
偽類選擇器(名稱為w3school所複製,感謝)
li:active 當某個li標籤被啟用之後所要新增的樣式
input:focus 當某個input獲取焦點之後的樣式
li:hover 當滑鼠懸浮在某個li標籤上面的時候所改變的元素
a:link 給超連結新增固定的樣式,也就是預設剛開啟網頁之後的樣式
a:visited 給已經訪問過的連線新增樣式,a標籤中的字型顏色將變為黑色
a:hover 當滑鼠懸浮到a標籤上方的時候,標籤中的字型顏色將變為黑色
a:active 標籤被選定之後,其字型顏色將變為黑色。也就是當滑鼠點下還未抬起的時候的樣式
注意事項:
在 css 定義中,a:hover 必須被置於 a:link 和 a:visited 之後,才是有效的。
在 css 定義中,a:active 必須被置於 a:hover 之後,才是有效的。
偽類名稱對大小寫不敏感。
標籤前後的文字樣式
li:before表示在li標籤最前面加上「你好」兩個字,並且字型顏色為黑色。
li:after表示與上面相反的作用
元素子標籤按序選擇器
li:nth-child(1){}意思是第乙個li元素
li:nth-child(2n+1){}意思是 1 3 5 7等元素
li:last-child{} 意思是最後乙個元素
偽元素li:first-line{}選中li標籤中的第一行文字
li:first-letter{}選中li標籤中的第乙個首字母
:hover 表示當前根目錄的全部背景顏色為黑色
div *:not(h1){} 表示div中所有的元素但是不包含h1標籤下的元素的選中方法
:empty{}表示選中標籤中沒有任何內容的標籤進行樣式處理
:target{} 表示頁面內跳轉的時候,跳轉到哪個區域哪個區域就會執行當前樣式
input的選擇
input[type="text"]:enabled{}
input[type="text"]:disabled{}
表示type型別為text的input中選中能用的和不能用的選中方法
CSS3每日一練之選擇器 結構性偽類選擇器
前端開發網 w3cfuns.com web前端開發起飛區,web前端開發高手聚集地,教程 資源完全免費!前端開發網 w3cfuns.com web前端開發起飛區,web前端開發高手聚集地,教程 資源完全免費!前端開發網 w3cfuns.com web前端開發起飛區,web前端開發高手聚集地,教程 資...
每日一練4
員工表emp 員工編號eid,姓名ename,工作職位title,僱傭日期hiretime,工資salary,獎金bonus,部門depart 部門表dept 部門編號did,名稱dname,部門領導leader 員工資料 1001,張三 銷售 1999 12 1 3000.0,1100.0,102...
每日一練25
請描述 mysql 從安裝到配置的全部詳細過程 確保一台新電腦可以順利使用 mysql mysql安裝嚮導啟動,按 next 繼續 選擇安裝型別,有 typical 預設 complete 完全 custom 使用者自定義 三個選項,我們選擇 custom 有更多的選項,也方便熟悉安裝過程 選擇配置...