css选择器优先级

作者：恋你如初发布日期:2025-05-12 浏览:22

/* 示例代码：CSS选择器优先级 */

/* 1. 内联样式（最高优先级） */
<p style="color: red;">这段文本是红色的。</p>

/* 2. ID选择器 */
#my-id {
    color: blue;
}

/* 3. 类选择器、属性选择器和伪类选择器 */
.my-class {
    color: green;
}

/* 4. 元素选择器和伪元素选择器 */
p {
    color: black;
}

/* 5. 通用选择器（最低优先级） */
* {
    color: gray;
}

/* 解释说明：
- 内联样式的优先级最高，直接在HTML标签中定义样式。
- ID选择器的优先级次之，每个页面中ID应该是唯一的。
- 类选择器、属性选择器和伪类选择器的优先级较低，但比元素选择器高。
- 元素选择器的优先级更低，应用于所有指定的HTML元素。
- 通用选择器的优先级最低，应用于所有元素。 */

上一篇：css 线性渐变

下一篇：css placeholder