在bootstrap中自定义css

时间:2013-10-13 21:14:36

标签: html css twitter-bootstrap

好的,所以我刚刚使用twitter bootstrap开始开发。我发现它非常方便易用。但是,当涉及到应用我自己的样式并添加我自己的背景颜色,链接颜色,按钮颜色和字体颜色它真的很令人沮丧。因此,我需要一些完整的资源或任何教程来解释如何在现有的bootstrap框架中添加我们自己的css。任何帮助将非常感谢!

5 个答案:

答案 0 :(得分:2)

如果你想自定义twitter bootstrap框架的外观:

  1. 始终使用 custom.css 文件覆盖主要bootstrap.css
  2. 将其包含在您的bootstrap.css
  3. 始终在引导网站上看到getting-started
  4. 请参阅此网站bootstrap-resources
  5. 希望这会对你有所帮助

答案 1 :(得分:1)

可以在引导程序网页上自定义字体和颜色。通过创建自己的custom.css可以实现添加背景和事物,custom.css可以包含在bootstrap.css文件之后。

答案 2 :(得分:0)

您可以在getbootstrap.com上自定义资源。我建议你阅读他们的组件文档,这样你就可以理解所提供的内容并将其与你需要的内容保持一致,这样你就可以避免使用膨胀的样式表。

此外,chrome还有一个很棒的工具,可以让你动态编辑CSS(我发现它比使用Firefox扩展更有用,更快)

答案 3 :(得分:0)

没有冒犯,但是 - 当你仔细阅读时,你会在项目的页面上得到你想要的所有信息:

On the project page是一个可以自定义所有LESS变量的小工具,the GitHub repo是一个有关如何从头编译LESS文件的自述文件。看看the LESS homepage,了解LESS实际上是什么。

答案 4 :(得分:0)

您只需要构建一个CSS引导程序,其值高于引导程序CSS中定义的CSS选择器specificity。在这里看到很好的解释:http://www.youtube.com/watch?v=In78mSOHmls

您可以使用内置的Firefox Page Inspector工具查看应用哪些规则以及覆盖哪些规则。 (它可以通过按 Ctrl + Shift + i 快捷键启动,在Chrome中它是 Ctrl + Shift + j