1

到目前为止,我已经从网上自学了 CSS。我觉得我做得很好,但我有一段时间试图编辑导航栏。我目前正在使用 Boostrap,但我对 CSS 有疑问,尤其是导航栏功能。

我了解 HTML 如何引用 bootstrap.css,但是在尝试拥有自定义 css (style.css) 时,我无法让导航栏使用顶级类更改颜色。例如改变 navbar 或 navbar-inverse : .navbar { background-color: white; } 不会改变背景。我必须进入 .brand 才能更改其中一个框的颜色。

  <div class="navbar-wrapper">
  <!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
  <div class="container">

    <div class="navbar navbar-inverse">
      <div class="navbar-inner">
        <!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. -->
        <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="brand" href="#">------------</a>

有些东西压倒了它,所以我的问题更多来自基本层面。我是否必须设置确切的元素或者 CSS 是否允许我更改一个总体类并且它适用于该 div 中的内容。

我的第二个问题是:bootstrap.css 是否覆盖了我的自定义 css?

4

2 回答 2

1

是的,有时会。使用网络检查器查看正在应用哪些规则。如果您希望您的自定义 CSS 覆盖 Bootstrap CSS,请重新排序您的 CSS<link>并列出您的最后一个。或更改bootstrap.css文件

编辑固定答案

于 2013-07-25T19:27:51.567 回答
0

我认为您可以先调用 bootstrap.css 然后调用您的自定义 css 文件,因此它会覆盖引导 css 规则。

如果仍然没有更改默认引导 css,您可以使用重要属性。

navbar { background-color: white !important; } 

我希望你的问题会得到解决。

于 2013-07-25T19:41:56.053 回答