web前端學習(三)css學習筆記部分(6)-- 選擇器詳解
阿新 • • 發佈:2018-11-30
9、選擇器詳解
9.1 屬性選擇器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> [id*=div]{/*選中id中有div字樣的*/ color:lime; } [id^=div]{/*選中id中開頭是div字樣的*/ color: #FF0000; } [id$=y]{/*選中id中結尾是div字樣的*/ color: fuchsia; } </style> <!--css樣式表放在前面和後面效果是相同的,只不過在前面的是隻渲染一次的 css放在後面引入的話頁面需要渲染兩次--> </head> <body> <div id="mydiv1">這是一段話測試</div> <div id="div2">這是一段話測試</div> <div id="div3">這是一段話測試</div> <div id="div4">這是一段話測試</div> <div id="my">這是一段話測試</div> </body> </html>
9.2 結構性偽類選擇器
9.3.1 偽類選擇器概述
9.3.2 偽元素選擇器概述
9.3 選擇器root、not、empty、target