无法覆盖特定div中的Bootstrap属性

时间:2013-05-03 02:20:09

标签: css html twitter-bootstrap

这是我在HTML部分中的代码块

<header>
    <div class="top_line"></div><br/>
    <div class="container">
       <div class="abcd">Über<span style="color:#2773AE">Tech</span></div>
       <div class="top_line"></div>
    </div>
</header>

我正在使用Twitter Bootstrap,我在Bootstrap CSS文件之后链接了一个自定义CSS文件,以将特定样式应用于我页面的某些部分。这是我的自定义css文件代码:

.top_line {
    background-color: #2773AE;
    height: 5px;
}

.abcd {
    font-size:50px; 
    line-height:25px;
}

每当我尝试将样式应用于容器内的abcd类时,只会出现bootstrap body标记中提到的默认大小14px和20px的行高。但是,top_line类工作正常。我试过.container .abcd,.container&gt; .abcd等许多东西,但我仍然没有得到我想要实现的字体大小和行高,正如我在CSS代码中给出的那样。内联样式虽然有效。谁能告诉我哪里出错了?

谢谢

2 个答案:

答案 0 :(得分:1)

您应该验证boostrap css文件中声明的深度,以确保为您的abcd类编写更强的规则。

另一种方法是使用不推荐的黑客,例如:!important,以确保你的声明更强。

例如:

.abcd {
    font-size:50px !important; 
    line-height:25px !important;
}

答案 1 :(得分:0)

Twitter引导程序在标签范围内放置了一个特定的类,你应该将类abcd放在标签范围内