html - 覆盖样式标题中的跨度样式

Question

这应该是一个简单的解决方案，但我似乎无法弄清楚。看看小提琴。为什么我不能覆盖第二个跨度的字体大小？这是代码：

html:

<h1>
    <span>hello </span>
    <span id="span2">world</span>
</h1>

CSS：

h1
{
    font-size:2em;
}
h1  #span2
{
    font-size:1em !important;
}

score 4 · Accepted Answer

因为您将字体大小设置<h1>为 2em。你内部的跨度<h1>是 1 em，这意味着类似于 100% 的继承字体大小。看看如果你设置span2to0.5em 和 btw 的字体大小会发生什么，你的第一个跨度缺少正确的结束标记。

score 1 · Accepted Answer

1

添加

 #span2     {
  font-size:1em !important;
}

于 2012-08-29T18:47:23.803 回答

score 0 · Accepted Answer

0

试试这个

h1 span
{
    font-size:2em;
}
h1 span#span2
{
    font-size:1em !important;
}

于 2012-08-29T18:49:25.673 回答

score 0 · Accepted Answer

em 是相对测量单位。你几乎可以用“%”代替“em”。因此，当您的跨度规则有“1em”时，它被解释为“让我 100% 成为我父母的大小”，因此没有效果。

如果你希望它是 h1 大小的一半，你需要：

#span2 {
   font-size: .5em;
}

4 回答 4