css 屬性書寫順序遵循以下規則:重要性聲明(覆蓋現有樣式)具體性聲明(針對特定元素或偽類)縮寫值(多個屬性值集合)longhand 屬性(展開縮寫值)值(按 css 規范中定義的順序)
CSS 屬性書寫順序
CSS 屬性的書寫順序遵循以下規則:
1. 重要性聲明(可選)
使用 !important
聲明覆蓋現有樣式,將該屬性置于最高優先級。
2. 具體性聲明
針對特定 HTML 元素(例如 div.class
) 或偽類(例如 :hover
) 指定屬性。
特殊性更高的聲明將覆蓋特殊性較低的聲明。
3. 縮寫值(可選)
使用單個屬性值同時設置多個屬性。
縮寫值必須按順序指定。
4. Longhand 屬性
展開縮寫值后,對應的 longhand 屬性將按順序指定。
5. 值
屬性值本身按其在 CSS 規范中定義的順序書寫。
示例:
<code class="<a style='color:#f60; text-decoration:underline;' href=" https: target="_blank">css">/* 重要性聲明 */ div.important-class { /* 具體性聲明 */ border: 1px solid red !important; /* 重要性聲明覆蓋 */ /* 縮寫值 */ background: #ccc padding: 10px; /* 縮寫值按順序指定 */ /* Longhand 屬性 */ background-color: #ccc; /* Longhand 屬性按順序指定 */ padding-top: 10px; /* Longhand 屬性按順序指定 */ }</code>
登錄后復制