css - 在 LESS 中使用 Bootstrap 中的 mixin 进行自定义

Question

我想为我的 custom.less 覆盖 border-radius:20px。无需像下面那样重复编写供应商修复程序，是否有任何方法可以从 Bootstrap LESS 文件中调用现有的 mixin？

.borderRadius(@radius){
border-radius: @radius;
-moz-border-radius: @radius;
-webkit-border-radius: @radius;
}

div{
.borderRadius(20px);
}

Answer 1

Bootstrap 实际上不再使用 mixins 作为供应商前缀，前缀是使用 autoprefixer 完成的.

但是，如果你想使用 Bootstrap 的其他 mixin，你可以直接导入它们

@import 'path/to/bootstrap/less/mixins/alerts.less`

.foo {
  .alert-variant(red, green, blue);
}

如果你想修改你的边界半径，更改或覆盖 path/to/bootstrap/less/variables.less 中的 @border-radius-base。