CSS-优先级

预立科技

于 2020-01-19 10:36:33 发布

阅读量716

点赞数 1

分类专栏： CSS 文章标签： css CSS-优先级

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/sinat_16998945/article/details/104037342

版权

CSS 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

优先级：由高到低依次是: 内联样式 > 内部样式表 > 外部样式表 > 浏览器缺省设置

优先级：由高到低依次是1,2,3,4

1.内联样式（在 HTML 元素内部）

<html>
<body>
    <div>
        <p style="color: red;">内联样式（在 HTML 元素内部）</p>
    </div>
</body>
</html>

2.内部样式表（位于head 标签内部）

<html>
<head>
    <style>
        #idp {
            color: red;
        }
    </style>
</head>
<body>
    <div>
        <p id="idp">内联样式（在 HTML 元素内部）</p>
    </div>
</body>
</html>

3.外部样式表（引入css文件）

<html>
<head>
    <link rel="stylesheet" type="text/css"  href="test1.css" />
</head>
<body>
    <div>
        <p id="idp">外部样式表</p>
    </div>
</body>
</html>

// test1.css