如何修改twitter bootstrap组件?

时间:2015-07-01 18:13:12

标签: css twitter-bootstrap twitter-bootstrap-3

我知道我可以有一个自定义样式表来覆盖我想要自定义的引导程序组件(例如jumbotron),但这是解决这个问题的正确方法"?我不认为这可以通过引导主题来完成,尽管我还没有读过很多关于这个主题的内容。任何指针都很受欢迎!

3 个答案:

答案 0 :(得分:0)

有几种方法可以修改默认的bootstrap css,并且没有一种方法本身或多或少是"对"比任何其他。这完全取决于您和/或您的团队的编码风格。以下列出了我想出的几种方法:

  1. 修改css文件downloaded from Bootstrap
  2. (我的选择)使用您自己的CSS覆盖Bootstrap样式。请务必遵守CSS特定性(External < Internal < Inline)的规则,如果您无法获得某个规则,请尝试阅读this answer或强制使用!important
  3. 注意:这可能不是一个全面的列表,只是一个起点。

答案 1 :(得分:0)

您可以使用浏览器DevTools来检查要更改的元素,在Rules / Styles部分中,您可以看到它使用的是哪些CSS元素,然后您可以创建自己的css文件并将CSS粘贴到那里更改它,以便覆盖bootstraps元素。以下是如何从Chrome https://developer.chrome.com/devtools#dom-and-styles和Firefox https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Open_the_Inspector获取devtools。不要忘记在bootstraps下导入CSS自定义脚本,这样它就会覆盖你想要更改的CSS。

答案 2 :(得分:0)

在他们的网站上使用twitter-bootstrap custom来自定义并下载自定义文件。或者只是创建一个自定义CSS文件并编辑像.jumbotron和其他东西

这样的类