加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

颜色 – navbar颜色在Twitter Bootstrap

发布时间:2020-12-17 23:29:03 所属栏目:安全 来源:网络整理
导读:如何更改Twitter Bootstrap 2.0.2的导航栏的背景颜色?如何更改导航条的所有元素的颜色以反映背景颜色? 解决方法 您可以覆盖引导颜色,包括.navbar-inner类,通过在您自己的样式表中定位它,而不是修改bootstrap.css样式表,像这样: .navbar-inner { backg
如何更改Twitter Bootstrap 2.0.2的导航栏的背景颜色?如何更改导航条的所有元素的颜色以反映背景颜色?

解决方法

您可以覆盖引导颜色,包括.navbar-inner类,通过在您自己的样式表中定位它,而不是修改bootstrap.css样式表,像这样:
.navbar-inner {
  background-color: #2c2c2c; /* fallback color,place your own */

  /* Gradients for modern browsers,replace as you see fit */
  background-image: -moz-linear-gradient(top,#333333,#222222);
  background-image: -ms-linear-gradient(top,#222222);
  background-image: -webkit-gradient(linear,0 0,0 100%,from(#333333),to(#222222));
  background-image: -webkit-linear-gradient(top,#222222);
  background-image: -o-linear-gradient(top,#222222);
  background-image: linear-gradient(top,#222222);
  background-repeat: repeat-x;

  /* IE8-9 gradient filter */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333',endColorstr='#222222',GradientType=0);
}

你只需要修改所有这些样式,你自己的,他们会被拾起,像这样的东西,例如,我消除所有的梯度效果,只是设置一个坚实的黑色背景颜色:

.navbar-inner {
  background-color: #000; /* background color will be black for all browsers */
  background-image: none;
  background-repeat: no-repeat;
  filter: none;
}

您可以利用诸如Colorzilla Gradient Editor之类的工具,并为所有浏览器创建自己的渐变颜色,并用您自己的颜色替换原始颜色。

正如我在评论中提到的,我不建议你直接修改bootstrap.css样式表,因为所有的更改将丢失一旦样式表更新(当前版本是v2.0.2),所以最好是包括所有的您的更改在您自己的样式表内,与bootstrap.css样式表一起。但请记住覆盖所有适当的属性,以在浏览器之间保持一致性。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读