在Bootstrap 4.5中创建自己的主题

如何解决在Bootstrap 4.5中创建自己的主题

我刚刚从getbootstrap.com下载了SASS源文件，并安装了编译器Koala。

据我了解，要做的方法是

1. 创建自己的sass文件。
2. 在文件的开头添加替代项。
3. 在文件末尾导入“ bootstrap.scss”。
4. 编译您的css文件，并将标准cdn替换为此css文件。

实际上，这可行，但是当我尝试使用自己的样式创建导航栏时，我意识到仅创建主题是不够的。一个示例是导航栏文本颜色以一种完全不适合主题的奇怪颜色显示。那么，我需要做更多的事情吗？下面是我的自定义scss。

// Custom.scss

// Make overrides and customizations
$myown: #0066CC !default;
$theme-colors: ("myown": #0066CC);

// Include all of Bootstrap
@import "bootstrap.scss";

解决方法

只有navbar-light和navbar-dark影响导航栏的文本颜色。使用navbar-dark应该可以正常工作：http://codeply.com/p/UAWVfUy3VX-由于蓝色较深。

SASS

$myown: #0066CC;
$theme-colors: ("myown": #0166CC);

@import "bootstrap";

HTML

<nav class="navbar navbar-expand-md navbar-dark bg-myown">...</nav>

另请参阅：Customizing Bootstrap CSS template