選擇器的優先級主要用於樣式發生沖突的情況下
選擇器范圍越小,優先級越高
行內樣式>id選擇器>類選擇器>標簽選擇器>通用選擇器
這里涉及一個權重值的問題,權重值越高,優先級越大
權重值
HTML分別為每種類型選擇器分配了一個權值:
(1)通用選擇器
權重值:0
(2)標簽選擇器
權重值:1
(3)類選擇器
權重值:10
(4)ID選擇器
權重值:100
(5)行內樣式
權重值:1000
權重值的計算:
權值的計算很簡單,直接看代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
a{color: yellow;}/*1*/
div a{color: green;}/*1+1*/
.demo a{color: black;}/*10+1*/
#demo a{color: orange;}/*100+1*/
div#demo a{color: red;}/*1+100+1*/
</style>
</head>
<body>
<a href="">this is 黃色</a>
<div class="demo">
<a href="">this is 黑色</a>
</div>
<div id="demo">
<a href="">this is 紅色</a>
</div>
</body>
</html>
運行結果:
自己在編譯器敲敲就懂了