html - Bootstrap 导航栏 CSS

标签 html css twitter-bootstrap navbar

<分区>

到目前为止,我都是通过网上的东西自学 CSS。我觉得我做得很好,但我在尝试编辑导航栏时遇到了麻烦。我目前正在使用 Boostrap,但我对 CSS 有疑问,尤其是导航栏功能。

我了解 HTML 如何引用回 bootstrap.css,但在尝试使用自定义 css (style.css) 时,我无法让导航栏使用顶级类更改颜色。例如,将导航栏或导航栏反转更改为:.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?

最佳答案

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

编辑固定答案

关于html - Bootstrap 导航栏 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17866914/

相关文章:

html - 优化 Angular 6 组件中的 css 选项,styles.css 中的通用 css 或每个组件 css

javascript - 使用 jQuery 打开多个视频嵌入模式

jquery - 如何让 jQuery 选择 CSS 样式的元素?

jquery - 单击页面的任何其他控件时丢失 Bootstrap 缩略图的事件类

html - 如何对齐具有特定宽度的文本框和标签

html - Bootstrap 标签和输入未水平对齐

php - 如果文件路径是 *.css 重定向,如何使用 .htaccess

javascript - 从 HTML5 FormData 对象中获取所有项目 - HTML5

javascript - 在组元素内居中(水平)对齐文本节点

javascript - 如何在不删除的情况下隐藏一段 HTML?