css专栏 02.选择器 07.选择器优先级

全栈开发

已于 2022-04-03 10:15:00 修改

阅读量72

点赞数

分类专栏： css 文章标签： css

于 2022-03-14 23:49:29 首次发布

本文链接：https://blog.csdn.net/m0_66351881/article/details/123491718

版权

css 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

# 07.选择器优先级

[toc]{type: "ol", level: [3]}

### 选择器优先级

- 选择器相同
> 从上向下读写，就近原则

- 选择器不同
> 精确度越高，范围越小，优先级越高
**行内式**{style="color:brown"} > **id选择器**{style="color:goldenrod"} > **类选择器**{style="color:green"} > **标签选择器**{style="color:gold"}

```html
<p id="p1" class="c1" style="color: darkblue">Love Apple</p>
```
```css
#p1 {
    color: green;
}

.c1 {
    color: chocolate;
}

p {
    color: green;
}
```