相关疑难解决方法(0)

如何更改Twitter Bootstrap 2.0.2导航栏的背景颜色？如何更改导航栏中所有元素的颜色以反映背景颜色？

我刚从Twitter开始使用Bootstrap,我想知道什么是"最佳实践"用于定制.我想开发一个系统,该系统将利用一个CSS模板的所有电源(引导或其他),彻底(容易地)修改的,是可持续的(即 - 当引导的下一个版本是从Twitter的我不要公布"我必须重新开始.

例如,我想在顶部导航中添加背景图像.看起来有三种方法可以解决这个问题:

1. 修改bootstrap.css中的.topbar类.我不是特别喜欢这个,因为我会有很多.topbar项目,我不一定要以同样的方式修改它们.
2. 使用我的背景图像创建新类并应用这两种样式(new和bootstrap到我的元素).这可能会产生样式冲突,可以通过将.topbar类剥离到单独的类中然后仅使用我的自定义类未处理的部分来避免这种冲突.同样,这需要比我认为必要的更多工作,虽然它很灵活,但是当Twitter发布下一部分时,它不允许我轻松更新bootstrap.css.
3. 使用.LESS中的变量来实现自定义.这似乎是一个很好的方法,但没有使用过.很少我担心在客户端编译css和代码可持续性.

虽然我使用的是Bootstrap,但这个问题可以推广到任何css模板.

提前感谢您的意见.

我是Bootstrap的新手,拥有旧版本2.3.2.

版本3已发布.如果我想使用最新版本,我只是简单地替换CSS和Javascript文件吗？

我有一个bootstrap网站,Hamburger当屏幕小于992px时添加.HamBurger代码是这样的

<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>

有没有可能改变HamBurger按钮的颜色？

我想知道如何在导航栏中将鼠标悬停在链接上时更改链接的颜色,因为目前它们是一种难看的颜色.

谢谢你的建议？

HTML:

<div class="container">
    <div class="navbar">
        <div class="navbar-inner">
            <ul class="nav">
                <li class="active"><a href="#">Home</a></li>
                <li><a href="#">Link One</a></li>
                <li><a href="#">Link Two</a></li>
                <li><a href="#">Link Three</a></li>
            </ul>
        </div>
    </div>
</div>

我想在引导程序中更改背景和文本颜色,navbar但它没有按预期更改...这是我的自定义CSS:

.navbar-default .navbar-fnt {
    color: #FFFFFF;
}
.navbar-default .navbar-backgrnd {
    color: #CC3333;
}

和相关的HTML:

<div id="menu" class="navbar navbar-default navbar-fnt navbar-backgrnd">
    <div class="navbar-header">
        <div class="collapse navbar-collapse">
              ul and li
        </div>
    </div>
</div>

我无法弄清楚为什么这不会改变背景和文字颜色 - 任何人都可以帮忙吗？

在Bootstrap 4中,如何更改导航栏的背景颜色？twbscolor的代码不起作用.我想使背景颜色为不同颜色,字体颜色为白色.

<nav class="navbar navbar-toggleable-md navbar-light bg-danger">
        <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
        </button>
        <a class="navbar-brand" href="#">Jordan Baron</a>

    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
            <li class="nav-item active">
                <a class="nav-link" href="#">Home</a>
            </li>
        </ul>
    </div>
</nav>

我已经查看了解决这个问题的其他帖子,但我仍然无法在Twitter Bootstrap中更改导航栏的背景颜色.我正在使用2.3.2版.我在twitter bootstrap 2.0.4中的这篇文章中更改了导航栏颜色,完成了baptme描述的所有内容.这是我用来覆盖原始bootstrap.css文件的CSS.

.navbar-inner {
  background: #eab92d; /* Old browsers */
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VhYjkyZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjNzk4MTAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  #eab92d 0%, #c79810 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eab92d), color-stop(100%,#c79810)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #eab92d 0%,#c79810 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #eab92d 0%,#c79810 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #eab92d 0%,#c79810 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #eab92d 0%,#c79810 100%); …

我已创建MVC5应用程序,在视图索引中标题颜色为黑色,我想更改它,我在哪里可以找到它？

我尝试搜索#000000,但它在很多地方......

在HTML中:

<div class="navbar navbar-default">

在variable.less文件中:

@navbar-default-bg: #f8f8f8;

将此十六进制颜色更改为其他颜色(即蓝色)后,您会注意到只有底边颜色变为蓝色.因为类导航栏也有背景,它会阻止@ navbar-default-bg颜色.

样品:

1.in html:

<div class="navbar navbar-default">

在variable.less:

@ navbar-default-bg:blue;

输出:

2.in html:

<div class="navbar navbar-default">

在variable.less:

@ navbar-default-bg:blue;

在custom.css中:

.navbar {background:blue}

输出:

我知道,如果我制作一个自定义的css文件,并将.navbar{background: blue}它改为我想要的导航栏颜色.

但我更喜欢编辑较少的文件.有没有办法做到这一点？ 在您认为这是一个重复的问题之前,请先尝试一下!