HTML中常見的選擇器 的優先順序
在HTML中常見選擇器有：
行內選擇器、標籤選擇器、id選擇器、類選擇器（class）
行內選擇器：通過style將樣式直接寫在標籤裡面：
格式為：style=“屬性1:屬性值1；屬性2:屬性值2；…”
例如：<p style=”color: red;font-size: 32px;”>啊啊啊啊</p>
注意：最後一個屬性值後面的分號可以省略，其他的屬性與屬性之間必須要有分號分開；現在行內選擇器也比較少用，原因是比較繁瑣，程式碼比較少可以考慮使用，但是程式碼一多，就很不好用了
標籤選擇器：就是利用標籤名通過內部樣式將標籤+樣式給表現出來；
格式：標籤{ 樣式1；樣式2；…}
例如：
<html>
<head>
<title>標籤選擇器</title>
<style type="text/css">
p{
color:green;
font-size:14px;
}
</style>
</head>
<body>
<p>啊啊啊</p>
</body>
</html>注意：標籤選擇器：運用範圍是：標籤的樣式是同一格式的範圍情況下，比較適用，但在同一標籤多種樣式的情況下不適合適用；
id選擇器：在標籤內定義一個id=“idname”，在內部樣式中使用:#idname{樣式}的方式使用id選擇器。
類選擇器（class）：在標籤內定義一個class=“classname”，在內部樣式中使用: .classname{樣式}的方式使用id選擇器。
行內樣式：寫在標籤裡面通過style=“屬性1：屬性值1；….”的方式改變標籤樣式；例如
<p style="color:red">啊啊啊</p>優先順序：
**id選擇器>標籤選擇器
行內樣式>id選擇器
類選擇器>標籤選擇器
id選擇器>類選擇器
即
行內樣式（最高階）>id選擇器>類選擇器>標籤選擇器
**
例子：
類選擇器與標籤選擇器的優先順序：
<html>
<head>
<meta charset="utf-8" />
<title>HTML選擇器的優先順序</title>
<style type="text/css">
p{
color: green;/*綠色*/
}
.blue{
color: blue;/*藍色*/
}
#red{
color: red;/*紅色*/
}
</style>
</head>
<body>
<h3>望廬山瀑布</h3>
<p >日照香爐生紫煙，</p>
<p class="blue">遙看瀑布掛前川。</p>
<p class="blue" id="red">飛流直下三千尺，</p>
<p class="blue" id="red" style="color: black;">疑是銀河落九天。</p>
</body>
</html>
如圖
從第一句到第四句可以很清楚的看到優先的變化是按照
行內樣式（最高階）>id選擇器>類選擇器>標籤選擇器來變化的