样式表的来源与优先级的实例演示 -

首页 > 博客列表 > 样式表的来源与优先级的实例演示

博主信息

博文 12

粉丝 0

访问量 8732

专题推荐

更多>

样式表的来源与优先级

来源1：代理样式/浏览器样式/默认样式（继承自HTML）

例如：
<h2>PHP中文网</h2>

来源2：自定义样式

自定义样式1：行内样式，style属性

~<h1 style="color: blue;">PHP中文网</h1>~

自定义样式2：文档样式/内部样式，style标签

    <h1>晚上好</h1>
    <h1>吃了吗</h1>
    <h1>xxx</h1>
    <style>
        h1{
            color: blue;
        }
    </style>

自定义样式3：外部样式，css文档

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>自定义样式来源与优先级</title>
    <style>
       @import url('static/style.css')；
    </style>
</head>

优先级1：自定义样式会覆盖默认样式

例如：
<h2 style="color: red;">PHP中文网</h2>

优先级2：书写顺序，写在后面的同名属性会覆盖前面的（优先级相同情况下）

    <div style="color: blue;">
        <h1 style="color: red;">php.cn</h1>
    </div>

批改老师：

PHPz

批改状态：合格

老师批语：

本博文版权归博主所有，转载请注明地址！如有侵权、违法，请联系admin@php.cn举报处理！

全部评论文明上网理性发言，请遵守新闻评论服务协议

0条评论

作者最新博文

MarkDown入门基础语法学习与HTML标签学习小结

2022-03-17 16:35:01