1

新建网站,使用960网格系统,css如下:960_24_col text rest

我也在使用我自己的 style.css。

所以,我正在尝试将以下 css 应用于我的标题 2 (h2)

h2 {
font-size: 26px;
text-transform: lowercase;
border-bottom: 1px solid yellow;
padding-bottom: 30px;
margin-bottom: 15px;
}

但它似乎并不适用。当我在 Chrome 中检查元素时,一些 h2 元素在我的 style.css 中被划掉(穿过它)......当我复制上面的代码说 text.css..它的作品(但也适用于其他 h1、h2、h3 等)

你们中的任何一个css向导都有什么想法吗?

4

2 回答 2

2

CSS 文件按顺序读取。因此,如果加载了一个将样式设置为 on的h1文件,并且加载了另一个也将样式设置为 on的文件h1,则第二个文件将覆盖第一个文件。

解决此问题的一种讨厌的方法是添加!important到样式的末尾,即:

h2 {
    font-size: 26px;
    text-transform: lowercase;
    border-bottom: 1px solid yellow !important;
    padding-bottom: 30px;
    margin-bottom: 15px;
}
于 2012-11-13T12:06:31.300 回答
-1

必须在 style.css 中为 h2 定义了一些其他样式chrome 检查器中的删除线表示该样式已被覆盖,请尝试查找 in 的任何其他h2出现style.css

或者,如果由于某些有意更改而想要保留两个样式定义,请尝试!important在您不想被覆盖的相应属性之后使用,以要求浏览器优先考虑该样式而不是其他样式

h2 {
font-size: 26px !important; /*same with every other property you want to give top priority*/
text-transform: lowercase;
border-bottom: 1px solid yellow;
padding-bottom: 30px;
margin-bottom: 15px;
}
于 2012-11-13T12:13:23.463 回答