Bootstrap - 修改按钮样式

时间:2014-07-10 07:52:13

标签: css twitter-bootstrap twitter-bootstrap-3 sass

有没有办法通过Sass文件更改Bootstrap样式 - 悬停和边框属性?

我没有在Variables文件中看到任何要编辑的属性

//== Buttons
//
//## For each of Bootstrap's buttons, define text, background and border color.

$btn-font-weight:                normal !default;

$btn-default-color:              #969696 !default; // #333 !default;
$btn-default-bg:                 #e7e7e7 !default; // #fff !default;
$btn-default-border:             #d4d4d4 !default; // #ccc !default;

$btn-primary-color:              #fff !default;
$btn-primary-bg:                 $brand-primary !default;
$btn-primary-border:             darken($btn-primary-bg, 5%) !default;

$btn-success-color:              #fff !default;
$btn-success-bg:                 $brand-success !default;
$btn-success-border:             darken($btn-success-bg, 5%) !default;

$btn-info-color:                 #fff !default;
$btn-info-bg:                    $brand-info !default;
$btn-info-border:                darken($btn-info-bg, 5%) !default;

$btn-warning-color:              #fff !default;
$btn-warning-bg:                 $brand-warning !default;
$btn-warning-border:             darken($btn-warning-bg, 5%) !default;

$btn-danger-color:               #fff !default;
$btn-danger-bg:                  $brand-danger !default;
$btn-danger-border:              darken($btn-danger-bg, 5%) !default;

$btn-link-disabled-color:        $gray-light !default;

1 个答案:

答案 0 :(得分:2)

如果您应用 SASS文件中的样式,请使用 SASS @extend关键字。

btn
   @extend .button-style //predefined style
   border: 1px solid blue
&:hover
   color: red 

注意:不要忘记在文档中导入 SASS 文件。