Bootstrap 4-覆盖Bootstrap类是不好的做法吗？

Question

例如：form-control looks like this

添加此scss对我来说是不好的做法吗？

.form-control {
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    outline: none;
    width: 100%;
    padding: 7px 20px;
    margin: 0;
    border: 2px solid $mdc-grey-400;
    box-sizing: border-box;
    border-radius:2rem;
}
form-control:focus, textarea:focus {
    box-shadow: 0 0 10px $mdc-orange-300;
    border: 2px solid $mdc-orange-500;
}

Answer 1

我认为这不是问题。 Bootstrap并不是真的可以限制您使用其样式，而是可以作为您的起点。如果人们不改写自己的样式，那么许多Bootstrap网站最终都会看起来完全一样。

话虽这么说，但您可以在变量border，border-radius，margin等变量中进行配置。

编辑：忘记了您提到的Bootstrap4。我发布的内容仅适用于3。

引导程序4

您可以覆盖自己主题中的变量。 https://getbootstrap.com/docs/4.0/getting-started/theming/#variable-defaults

您要覆盖的变量是： https://github.com/twbs/bootstrap/blob/master/scss/_variables.scss#L447

引导程序3

https://getbootstrap.com/docs/3.4/customize/#forms

Answer 2

这是一个坏习惯，因为您要一遍又一遍地使用事物，或者如果其他人要编辑事物的东西

您可以更好地添加具有适当名称和样式的另一类。

并且永远不要直接使用您自己的css文件来编辑Bootstrap文件。