V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
miniyao
V2EX  ›  问与答

为什么 .danger h1 { color: #ff0000; } 这样会覆盖全局的 h1 样式呢?

  •  
  •   miniyao · 2017-12-08 14:05:36 +08:00 · 1236 次点击
    这是一个创建于 2566 天前的主题,其中的信息可能已经有所发展或是发生改变。

    我在 styles.css 文件里定义了这样一行:

    .danger h1 { color: #ff0000; }
    

    页面 HTML 就是这样:

    <div class="danger">
        <h1>危险操作</h1>
    </div>
    

    结果搞得其他好几个地方的<h1>Title</h1>颜色都变红颜色 #ff0000 了,但也有的地方又没有变。大多的结构都类似是这样的写法:

    <div class="xxx">
        <h1>Title</h1>
    </div>
    

    (系统全局默认引用了 百度 cdn 的 bootstrap css )这个 css 样式的覆盖顺序由什么问题吗?

    5 条回复    2017-12-08 19:09:42 +08:00
    phy25
        1
    phy25  
       2017-12-08 14:15:52 +08:00 via Android   ❤️ 1
    .danger > h1 ?可以看看是不是 body 之类的位置带了个 .danger ……
    miniyao
        2
    miniyao  
    OP
       2017-12-08 14:28:42 +08:00
    @phy25 加了箭头 > 也没用,避免冲突,我改成 .danger-abc h1{...} 也还是会覆盖别的 h1,好奇怪。明明那个 h1 是写在 class="xxx"里的。
    wleven
        3
    wleven  
       2017-12-08 14:29:56 +08:00   ❤️ 1
    F12
    miniyao
        4
    miniyao  
    OP
       2017-12-08 14:37:37 +08:00
    @wleven 我说的就是 F12 里看的结果。<div class="xxx">h1Title</h1></div>里如果不指定 h1 样式,就显示 bootcss 的 h1 被 .danger h1 覆盖了。
    xmcp
        5
    xmcp  
       2017-12-08 19:09:42 +08:00   ❤️ 1
    给个 demo 啊,这样尬聊怎么解决问题……
    放到 jsbin.com 什么的都可以
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3706 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 10:39 · PVG 18:39 · LAX 02:39 · JFK 05:39
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.