2014-01-17 59 views
0

所以我在我的html中有一个元素,我需要为其应用特殊的样式。 我可以用css来定位elemnt,但在css中的其他地方会被覆盖多个。 我如何确保应用一种风格而不是另一种?覆盖元素上的css样式

我尝试过使用!在我的CSS中很重要,但它仍然不起作用。

我谈论

ul.M1 li.M3 { 
    font-size:13px; 
} 

,但是这个人是不是来代替,这是使用:

li.M3 { 
    font-size: 100px; 
} 

,它被重写一堆其他地方了。

+1

importent是非常重要的:), 改变哪些类的出现顺序,如果可能的话可以帮你 –

+0

创建一个jsFiddle? –

回答

1

位次在CSS:

  • 内联样式
  • 嵌入样式
  • 外部风格

和选择优先级:

  • ID选择
  • 属性选择
  • 类选择
  • 子选择
  • 相邻兄弟选择
  • 后代选择
  • 类型选择

!important具有最高优先级,并且如果两个或更多的规则有!important,那么优先级将如上所述。

ul.M1 li.M3 { 
    font-size:13px; !important 
} 
7

更正拼写并使用!important而不是!importent

例如,

ul.M1 li.M3 { 
    font-size:13px !important; 
} 

在最后的样式表的声明,并在</head>尽头在你的网页链接的样式表。

希望这会有所帮助。

+0

它在我的css中拼写正确:) – IronMonkey

+0

在样式表的最后声明它,并在的末尾链接该页面中的样式表 - @IronMonkey – Nitesh

0

使用!important!重要的是你想要完成的规则​​。

li.M3 { 
    font-size: 100px !important; 
} 
0

您应该能够使用重要的没有问题!

ul.M1 li.M3 { 
    font-size:13px !important; 
} 

但我不建议这样做。我尽量避免不惜一切代价使用!important。原因是,一旦应用它,就很难取消它。这可能会导致一些重要的维护问题。

我会建议利用特异性来代替您的风格。学会热爱浏览器的开发人员工具,并使用它们来识别正在应用的样式,正在应用它的选择器。

然后,创建一个新的,稍微更具体的选择器,将承担更多的权重。举例来说,如果你申请一个ID您ul,你可以利用,要建立一个更具体的选择应该胜出:现在

ul#myID li.M3 { 
    font-size:13px !important; 
}