为什么CSS没有生效?

时间:2013-03-13 14:52:56

标签: html css css3

在下一页上是正文,包括一些项目符号文本。我需要子弹文本与正文文本相同(更大)。

http://www.a-quick-sale.co.uk/howitworks/

网站上有一个全局样式表(/global.css),我在其中添加了一个条目:

li { font-size: 14px;}

但是没有应用这种字体大小的样式。我不想开始懒惰并直接将样式应用于页面上下文,但为什么我创建的全局样式没有被应用?

十多年来我没有使用CSS或HTML做过任何工作,所以请保持温和 - 对于拥有当前技能的人来说,答案很明显。

8 个答案:

答案 0 :(得分:3)

由于div#content li比单个类型选择器更具体,因此您需要包含级联中较高的元素以覆盖特定属性

特异性可以被认为是四个数字(0,0,0,0)

  • 内联样式是第一个 - 最高优先级
  • ID选择器是第二个数字
  • 伪类和属性选择器是第三个
  • 类型选择器是第四个
  • 通用选择器*的特异性为0,任何东西都会覆盖它。

因此,仅指定li的值为(0,0,0,1)vs div#content li,其特异性为(0,1,0,1),后者获胜。只需使用这个概念来提出更高的选择器。

答案 1 :(得分:2)

在global.css文件中,有一个更具体的选择器div#content li,其中选择了font-size。与您的选择器一样具体,或者更具体地适用于整个内容区域。

答案 2 :(得分:2)

在同一个global.css中,应用了div#content li { font-size: 12px;},因为它更具体。

答案 3 :(得分:1)

尝试强制样式,如下所示:

li { font-size: 14px !important ;}

因此它优先于该元素的现有样式。

答案 4 :(得分:1)

如果您使用Chrome开发者工具(F12),您可以看到哪些样式应用于每个元素,甚至可以看到样式在被划掉时被覆盖,这对于调试这样的CSS问题非常有帮助。

答案 5 :(得分:0)

因为在相同的文件中,在第208行,您定义的div#content li {font-size: 12px;}li更准确。

答案 6 :(得分:0)

我应该说你需要将样式应用于链接本身,而它不仅仅是li中的纯文本。

li a { font-size: 14px;}

答案 7 :(得分:0)

在您的global.css的108行,您有一个CSS规则div#content li { font-size: 12px;},它会覆盖您的li { font-size: 14px;}规则。