在哪里可以找到 bootstrap 类' css 定义?
Where to find bootstrap classes' css definitons?
比如我想改变.navbar-default导航栏的css背景颜色,可以通过.navbar-default{background-color:#000;}
但我想要的是,查看 .navbar-default class 的完整 css 样式定义,这样我就可以查看和更改每个元素(文本颜色、悬停颜色和所有其他元素)东西)随我喜欢。我不想检查来自浏览器的 css 代码的网页元素,而是想查看定义包含的地方。
如果您正在使用 Bootstrap 的 CDN
"version",那么您将无法编辑 CSS
。
一个很好的方法是使用您自己的 local bootstrap.css
文件副本。您将在此处找到所有定义,您可以根据需要更改它们。
相反,如果您需要更多控制权,您也可以编辑 .sass
或 .less
文件。
edit:
由于 OP 是 使用 CDN,请按照以下步骤操作,您应该没问题:
- 确定要编辑的 元素/标签:
div
、input
等
- 确定要编辑的 属性:
color
、height
等
- 最重要的是:确定元素的
class
或 id
。
完成上述操作后,创建一个新样式文件,例如:styles.css
,并根据 CSS 规则在其中写入新的自定义 CSS
规则。
通过使用 link
标签
将其链接到您的 .html
文件中来包含此文件
瞧!
You can find and edit it in bootstrap.min.css
您可以找到所有可读格式的内容here
这是新版本
https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.css
只需检查 header 导入 link 并删除最小化的 .min 部分 link
比如我想改变.navbar-default导航栏的css背景颜色,可以通过.navbar-default{background-color:#000;}
但我想要的是,查看 .navbar-default class 的完整 css 样式定义,这样我就可以查看和更改每个元素(文本颜色、悬停颜色和所有其他元素)东西)随我喜欢。我不想检查来自浏览器的 css 代码的网页元素,而是想查看定义包含的地方。
如果您正在使用 Bootstrap 的 CDN
"version",那么您将无法编辑 CSS
。
一个很好的方法是使用您自己的 local bootstrap.css
文件副本。您将在此处找到所有定义,您可以根据需要更改它们。
相反,如果您需要更多控制权,您也可以编辑 .sass
或 .less
文件。
edit:
由于 OP 是 使用 CDN,请按照以下步骤操作,您应该没问题:
- 确定要编辑的 元素/标签:
div
、input
等 - 确定要编辑的 属性:
color
、height
等 - 最重要的是:确定元素的
class
或id
。
完成上述操作后,创建一个新样式文件,例如:styles.css
,并根据 CSS 规则在其中写入新的自定义 CSS
规则。
通过使用 link
标签
.html
文件中来包含此文件
瞧!
You can find and edit it in
bootstrap.min.css
您可以找到所有可读格式的内容here
这是新版本
https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.css
只需检查 header 导入 link 并删除最小化的 .min 部分 link