无法在跨度类中定位 h1答案

【问题标题】：Unable to target h1 in span class无法在跨度类中定位 h1
【发布时间】：2014-12-26 17:30:06
【问题描述】：

我有一个跨度类，我试图将 H1 定位到样式中，但它不起作用。

这是我的html。

<div class="col-md-9">
                <span class="testimonial"><h1>Testimonial</h1></span>
</div>

还有我的css

.testimonial h1 {
    font-size: 16px;
    font-weight:bold;
}

我没有正确使用 CSS 吗？

【问题讨论】：

它对我来说很好。你能解释一下什么不起作用吗？ jsfiddle.net/6rL1tsed 您可以使用检查元素来查看问题所在..
应该可以正常工作..：jsfiddle.net/bfgrebgc
这是您文件中的 HTML 还是实际输出？
使用浏览器的 DOM 检查器查看哪些规则应用于这些元素。它可能类似于 !important 规则在其他地方覆盖您在此处发布的 CSS。
我的猜测是，这是在 HTML 文件中，但浏览器呈现它的方式不同，因为内联元素 (span) 中不允许块元素 (h1)。因此，实际输出不会在.testimonial 中包含h1。至少，像 CKEditor 这样的一些编辑器会过滤此类结构。

标签： html css

【解决方案1】：

可能是您尝试过的特异性问题：

div.col-md-9>span.testimonial>h1 {
    font-size: 16px;
    font-weight:bold;
}

【讨论】：

【解决方案2】：

试试这个：

.col-md-9 .testimonial h1 {
    font-size: 16px;
    font-weight:bold;
}

【讨论】：

【解决方案3】：

你在链接精细的 css 文件吗？

它对我有用，它正是你的代码：

<html>
<head>
    <style type="text/css">
        .testimonial h1 {
            font-size: 16px; font-weight:bold;
        }
    </style>
</head>
<body>
    <div class="col-md-9">
        <span class="testimonial">
            <h1>Testimonial</h1>
        </span>
    </div>
</body>
</html>

【讨论】：