css优先级

最新推荐文章于 2024-08-11 23:43:12 发布

xwx_100

最新推荐文章于 2024-08-11 23:43:12 发布

阅读量284

点赞数

分类专栏： html+css+js

本文链接：https://blog.csdn.net/xwx_100/article/details/84197537

版权

html+css+js 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

css优先级

1. 选择器

2. 优先级

标签选择器(高) <-- class选择器 <-- id选择器(低)

若是同等级优先级，则按文本顺序

优先级越高，优先被选取，优先被替换。所以id选择器说了算

3. html测试代码及结果图

<style type="text/css">
    body h1 {
        color: green;
    }
    html h1 {
        color: purple;
    }
    #title_id {
        color: blue;
    }
    .title_cls {
        color: red;
    }
    span p {
        color: green;
    }
    body p {
        color: purple;
    }
 
</style><body>
<h1 id="title_id" class="title_cls">Here is a h1 title!</h1>
<span>
    <p id="title_p" class="title_p">Here is a p title</p>
</span>
</body>