Question

我刚刚在我的网站上安装了bootstrap 3.0并且一直在玩。我有几个问题;

我想在我自己的.css文件中更改jumbotron（和其他类）的某些规范。我有一个名为“mycss.css”的文件，并在其中添加了以下代码

.jumbotron {
    background-image: url();
    padding: 30px;
    margin-bottom: 30px;
    font-size: 21px;
    font-weight: 200;
    line-height: 2.1428571435;
    color: inherit;
    background-color: #eeeeee;
}

在我的index.htm中，我已经声明了我的.css如下（在bootstrap.min.css声明之后）;

<link href="css/my.css" rel="stylesheet" media="screen">

但是，这些更改未反映在我的网站上。还有什么需要改变吗？

Answer 1

"I have a file called 'mycss.css' "


<link href="css/my.css" rel="stylesheet" media="screen">

这些不匹配。这可能是问题所在。

我的答案可能是真正的问题，但是 -

@ SeWonJang的观点仍然有效，无论是ID还是类 - 很可能是问题所在。如果我创建：.main-content ul {list-style: none}然后.main-content中的某个地方为my-list提供ul课程，我不能只说.my-list {list-style: disc} ---因为我已经太具体了（或者说太过分了） - 我已经说过：“将这些规则应用于.main-content中的任何内容。”这胜过.my-list {list-style: disc}。现在我不得不说.main-content .my-list {list-style:disc}我真的只发现这是一个真正的类型问题。因为几乎所有东西都是垃圾清单 - 但是在文章文本中我想要一些列表样式 - 这对我来说是最好的例子。

Answer 2

它被称为CSS特异性。

http://stackoverflow.com/questions/12780511/how-does-a-css-rule-override-another-css-rule

“由于CSS特异性。选择器的权重是根据构成它的组件来评估的，id的权重为100，权重为10的类，权重为1的元素选择器。”

这意味着，你的目标元素越具体，它就越重。

所以如果你想为.jumbotron类指定一些属性，

为了覆盖它，你需要使选择器更具体，

例如，

#your_id .jumbotron

这样，当您的浏览器解释您的CSS样式时，

如果选择你的风格而不是Bootstrap的默认风格。

Bootstrap CSS编辑

2 个答案: