Html 如何更改 Twitter 引导程序背景颜色
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20456605/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change twitter bootstrap background color
提问by betoharres
I already tried the custom function from the website, but keeps give me error, and tried the BASIC method too:
我已经尝试过网站上的自定义功能,但一直给我错误,并且也尝试了 BASIC 方法:
body {background-color:red;}
so, does anyone know?
所以,有人知道吗?
回答by scooterlord
Download all of the bootstrap files and somewhere inside the .css file add:
下载所有引导程序文件并在 .css 文件中的某处添加:
body {
background:red !important;
}
回答by Oceinic
The correct way to change background color in Bootstrap 3 is to use bg-*
classes. For red color there is bg-danger
. Also available bg-primary, bg-success, bg-info and bg-warning
.
http://getbootstrap.com/css/#helper-classes-backgrounds
在 Bootstrap 3 中更改背景颜色的正确方法是使用bg-*
类。对于红色,有bg-danger
。也可用bg-primary, bg-success, bg-info and bg-warning
。
http://getbootstrap.com/css/#helper-classes-backgrounds
回答by Kevin Lynch
I would not recommend changing the actual bootstrap CSS files. You can create a custom bootstrap style sheet with one of the available Bootstrap theme generator(Bootstrap theme generators). That way you can use 1 style sheet with all of the default Bootstrap CSS with just the one change to it that you want. With a Bootstrap theme generator you do not need to write any CSS. You only need to set the hex values for the color you want for the body (Scaffolding; bodyBackground).
我不建议更改实际的引导 CSS 文件。您可以使用可用的Bootstrap 主题生成器(Bootstrap 主题生成器)之一创建自定义引导程序样式表。这样你就可以使用 1 个样式表和所有默认的 Bootstrap CSS,只需对它进行一个你想要的更改。使用 Bootstrap 主题生成器,您无需编写任何 CSS。您只需要为身体所需的颜色设置十六进制值(脚手架;bodyBackground)。
SOURCE: How to change the default background color white to something else in twitter boostrap
回答by Prashant Tiwari
I would strongly recommend using Sass with Bootstrap-Sassnot just for making any customisations to the core Bootstrap framework but also to ensure your CSS is as DRY as possible. Then you can do something like
我强烈建议将 Sass 与Bootstrap-Sass 一起使用,不仅可以对核心 Bootstrap 框架进行任何自定义,还可以确保您的 CSS 尽可能 DRY。然后你可以做类似的事情
$red: #f00;
$body-bg: $red;
before you import your core Bootstrap CSS, and you will be good to go. Note that Sass allows you to reuse the variable ($red) you just declared anywhere else you may like in your app.
在导入核心 Bootstrap CSS 之前,一切顺利。请注意,Sass 允许您在应用程序中的任何其他地方重用刚刚声明的变量 ($red)。
The benefits of using a CSS preprocessor like Sass or LESS don't end here. Bootstrap is based on a proportionate system of font sizes, so you can also do something like
使用像 Sass 或 LESS 这样的 CSS 预处理器的好处还不止于此。Bootstrap 基于字体大小的比例系统,因此您也可以执行以下操作
$font-size-base: 16px;
and that will accordingly change the font sizes of all elements (p, h1..h6 etc) across the board. You may also, for example, write
这将相应地改变所有元素(p、h1..h6 等)的字体大小。你也可以,例如,写
$font-family-sans-serif: 'Gill Sans';
and that will replace Helvetica as the default sans-serif font for all elements.
这将取代 Helvetica 作为所有元素的默认无衬线字体。
Look herefor all the customisations you can make to your code whenever you wish and not just while downloading Bootstrap if you use Sass.
看看这里的一切,只要你愿意,你可以对你的代码的定制不仅仅而如果你使用的Sass下载引导。
回答by Dan
In html change to In CSS change "body {}" to ".body {}" This is because a CLASS is more specific than a tag, and so it will take the rule over the main bootsrap.css which only classifies as a tag.
In html change to In CSS change "body {}" to ".body {}" 这是因为 CLASS 比标签更具体,因此它将对仅分类为标签的主 bootsrap.css 采取规则.
回答by Patrick Lee Scott
I have a boilerplate I've created that I use to create bootstrap themes, that will generate docs using the theme you've created. I've implemented this at companies that use it across multiple web teams in order to get a branded result while just using basic bootstrap components.
我创建了一个样板,用于创建引导程序主题,它将使用您创建的主题生成文档。我已经在跨多个网络团队使用它的公司中实现了这一点,以便在仅使用基本引导程序组件的同时获得品牌结果。
Check it out here: https://github.com/patrickleet/bootstrap-override-boilerplate
在这里查看:https: //github.com/patrickleet/bootstrap-override-boilerplate
There are instructions in the README
README里面有说明
回答by Ajmal Praveen
For Bootstrap 3.3 Add the following BG Style.
对于 Bootstrap 3.3,添加以下 BG 样式。
body{
background-color: gray !important;
}
Source : from Bootstrap 3.3 Guide.
来源:来自 Bootstrap 3.3 指南。