CSS的优先级顺序

最新推荐文章于 2023-08-11 19:42:30 发布

Bridge_go

最新推荐文章于 2023-08-11 19:42:30 发布

阅读量458

点赞数

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

本文链接：https://blog.csdn.net/breakbridge/article/details/107079722

版权

CSS 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
        p { background-color: yellow !important; }    /*1.!important 优先级最高*/
        #p1 { background-color: blue; }               /*3.ID选择器*/
        .p1 { background-color: red; }                /*4.类选择器*/
        p { background-color: green; }                /*5.标签*/
        * { background-color: Highlight; }            /*6.通配符*/
        div { background-color: orange; }             /*7.继承*/
    </style>
</head>
<body>
    <div>
        <p id="p1" class="p1" style="background-color:lime">Hello</p>   <!--2.行内样式-->
    </div>
</body>
</html>

优先级顺序（从高到低）：

标记为 !important
行内样式
ID选择器
类选择器
标签
通配符
继承
默认样式

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Bridge_go

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
CSS的优先级顺序

<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title></title> <style> p { background-color: yellow !important; } /*1.!important 优先级最高*/ #p1 { background-color: blue; } .
复制链接

扫一扫