引导最佳实践？

Question

我同时从事网页设计和开发工作。我通常更喜欢编写自己的 CSS 而不是使用任何框架。在我当前的项目中，客户在我完成设计后说，如果我也可以编写 HTML 和 CSS 代码，这将有助于他们的开发团队。他们的要求是使用 Bootstrap 4。

我说好的，然后开始工作。但是，我对使用 Bootstrap 时的最佳实践有一些疑问。 例如，假设我想要一个 .navbar-text 需要具有某种非主题颜色的左边框。我的问题是：

• 我应该为此创建一个新类，还是只覆盖 .navbar-text 类？通常我会遵循 BEM 并为此创建一个新类，但我不确定在这种情况下是否会造成混淆。
• 由于我已经为边框添加了 CSS 规则，我应该继续在元素上添加 Bootstrap 实用程序类，还是应该将 CSS 添加到新规则中？假设我想添加一些左填充，我应该将 pl-2 类添加到元素中，还是应该将 padding-left: 0.5rem 添加到我的 CSS 规则中？

我想让我的代码尽可能简单，以便他们的开发团队使用，但我不知道如何继续。任何建议将不胜感激。

Answer 1

我应该为此创建一个新类，还是只覆盖 .navbar-text 类？通常我遵循 BEM 并会创建一个新课程 为此，但我不确定这是否会令人困惑 实例。

创建一个新类。覆盖或更改引导类是不行的，因为如果它们最终升级到新版本的引导，或者开始使用 CDN 与本地托管（反之亦然），东西将停止以过去的方式工作，而且它们不会知道为什么。将 bootstrap 保留为 bootstrap 可以让新开发人员轻松上手，而不必质疑“这是 bootstrap，还是他们特定的 bootstrap 风格”。

编辑：

为了澄清，在您的示例中，我将创建一个实用程序类并将其添加到元素中。所以在 html 中你会有 class="navbar-text left-border" 和在我的 css 中 .navbar-text.left-border{border-left: 1px solid black;} 而不是 .navbar-text{border-left: 1px solid black !important;}

由于我已经为边框添加了 CSS 规则，我是否应该继续 在元素上添加 Bootstrap 实用程序类，或者我应该添加 CSS 符合我的新规则？假设我想添加一些左填充，我应该添加 元素的 pl-2 类，或者我应该添加 padding-left: 0.5rem 到 我的 CSS 规则？

将其添加到您现有的规则中。这样想：

假设您改变主意并且实际上不再需要该填充，或者您想将其更改为新值。您是希望在 CSS 中的一个地方更改它，还是在 html 中使用该类的任何地方更改它？