Question

我想为包含自举按钮的部门指定CSS样式，我这样做的方法是在button标记内指定内联CSS代码，以免影响菜单中的其他自举按钮页面。

以下代码可内联工作：

<div id="bootstrapButton">
    <button style="padding: 5px; width: 250px; margin-top: 4px !important" class="btn btn-outline-primary shadow bg-white rounded" type="button" data-toggle="collapse" data-target="#adminSection" aria-expanded="false" aria-controls="adminSection">
</div>

但是我想导入一个CSS文件，该文件包含div中按钮的样式相同（请注意，受影响的类将是“ btn”）。

Answer 1

几乎没有理由使用内联样式或!important。除非绝对必要，否则请尽量避免这样做。
为什么不将样式放在您想在任何地方使用的可重用类中？例如：

.btn.btn-variant-1 { // Or whatever class name you want.
    padding: 5px;
    width: 250px;
    margin-top: 4px;
}

然后您可以在html中这样使用它：

<button class="btn btn-outline-primary shadow bg-white rouded btn-variant-1">CLick me!</button>

如何使用bootstrap4将CSS应用于特定的div按钮？

1 个答案: