1

当视口很窄时，在引导程序中会出现一个按钮......使用引导响应......

如何更改此按钮的颜色外观？我知道 bootswatch.com 上的人们可以通过在 less 中更改一些变量来做到这一点，但他们是如何做到的？

编辑：我使用以下 SASS 代码取得了一些进展。（我使用 sass-bootstrap gem）

.navbar .btn-navbar {
  background-color: $navbarLinkBackgroundHover;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;

          &:hover {
            background-color: lighten($navbarLinkBackgroundHover, 1%);
          }
}

上面改变了我的按钮的背景和按钮的圆度..我仍然不知道如何改变边框笔触？有任何想法吗？

.navbar .btn-navbar .icon-bar {
  background-color: $heading-blue;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

现在这段代码可以帮助我改变按钮内水平破折号的颜色！

编辑2：

弄清楚了边框中风..它在css中称为边框颜色和边框宽度！（适用于 .navbar .btn-navbar）

  border-color: $dropdown-border $dropdown-border darken($dropdown-border, 10%) $dropdown-border;
  border-width: 2px;
4

2 回答 2

1 
.navbar .btn-navbar {
display: none;
float: right;
padding: 7px 10px;
margin-left: 5px;
margin-right: 5px;
color: #ffffff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #ededed;
background-image: -moz-linear-gradient(top, #f2f2f2, #e5e5e5);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f2f2f2), to(#e5e5e5));
background-image: -webkit-linear-gradient(top, #f2f2f2, #e5e5e5);
background-image: -o-linear-gradient(top, #f2f2f2, #e5e5e5);
background-image: linear-gradient(to bottom, #f2f2f2, #e5e5e5);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2f2f2', endColorstr='#ffe5e5e5', GradientType=0);
border-color: #e5e5e5 #e5e5e5 #bfbfbf;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
*background-color: #e5e5e5;
/* Darken IE7 buttons by default so they stand out more given they won't have borders */

这是带有属性的 CSS 选择器。您可以创建一个新的 CSS 规则来覆盖这些值，而无需更改 less 变量。

如果您想知道 less 变量是如何工作的，它们会根据变量值创建渐变。例如， 

box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);

从比黑色亮 75% 的颜色创建一个盒子阴影。变量 0, 0, 0 被传递给 box-shadow 属性。

于 2013-02-16T01:19:19.397 回答
-1

为什么不简单地用style = "background-color:#hex;". 如果你有用

于 2013-07-29T05:45:18.047 回答