有效地覆盖Bootstrap CSS

Question

我一直在寻找有效覆盖Bootstrap CSS的方法。我已经看到了一些问题及其答案，其中两个值得注意的是：

• Bootstrap variable overriding with LESS
• best way to override bootstrap css

但我不相信他们会解决我的具体用途。我也很欣赏对我的思维过程的批评，如果它甚至值得付出努力。到此为止。

以下是我希望能够做到的事情：

1. 使用Less / Sass利用Bootstrap的内置变量并进行框架范围的更改，例如导航栏高度或折叠断点。使用CSS很难做到这些，但使用Less / Sass非常容易，所以你可以在这里看到优势。
2. 通过CDN使用Bootstrap。从性能到可靠性，这些都有很多好处。
3. 链接到（主持）一个包含我唯一更改的样式表。这样可以减少文件大小以及CSS冗余，只保留必要的覆盖。它还提高了客户端和服务器的性能。

如果我只是编辑Less文件并重新编译它们，我基本上自己托管Bootstrap，不需要CDN。但是如果我通过CDN托管Bootstrap并且只托管我自己的更改，我知道实现这一点的唯一方法就是使用纯CSS，从而失去了Less variables的优势。

思想？

Answer 1

我会通过CDN导入bootstrap，然后有一个单独的css文件（从less生成），它使用比bootstrap更具体的选择器。

唯一的问题是使用较少的变量。如果它们都在一个单独的文件中，请导入它。或者您可能需要咬紧牙关并将它们手动复制到您自己的文件中。这可能没问题，因为无论如何你都要覆盖css。

确保在CDN链接中设置引导程序的版本，而不是使用最新版本。否则新版本可能会出现并破坏。