织梦CMS - 轻松建站从此开始!

我的网站

当前位置: 主页 > 新闻资讯 > 前端教程 >

CSS中优先级代码!important用法

时间:2018-11-20 21:37来源:未知 作者:admin 点击:
本篇文章将给大家分享一下使用CSS的!important如何改变优先级,通常,CSS可以根据上面的顺序来使用CSS样式,CSS有很多优先顺序的决定方法,但是优先级最高的是我们本篇文章要说的!i

本篇文章将给大家分享一下使用CSS的!important如何改变优先级,通常,CSS可以根据上面的顺序来使用CSS样式,CSS有很多优先顺序的决定方法,但是优先级最高的是我们本篇文章要说的!important。

语法和描述:

!important为开发者提供了一个增加样式权重的方法。应当注意的是!important是对整条样式的声明,包括这个样式的属性和属性值。这里有个简单的代码示例可以清晰地说明!important是如何应用于原本的样式中的:

#example {

  font-size: 14px !important;

}

#container #example {

  font-size: 10px;

}、


在上面的代码示例中,由于使用了!important,id为“example”的元素字号将被设置为14px。
 

如果不使用!important,第二个样式声明的代码块很自然地比第一个的权重要大,原因有二:在样式表中第二个代码块要比第一个出现的晚(即,它位列第二);第二个代码块有更大的权重(是由两个id,#container #example组合而成,而不是只有一个id,#example。但是因为第一个代码块里面包含了!important,所以对于字号设置来说它有更大的权重。

关于!important应该注意的一些地方:

当!important第一次在CSS1中被介绍时是这样规定的,即一个由开发者声明的!important样式要比一个由用户声明的!important样式获得更大的权重。为了提高访问性,在CSS2 中它被颠倒了过来。

如果!important被用于一个简写的样式属性,那么这条简写的样式属性所代表的子属性都会被作用上!important。

关键字!important必须放在一行样式的末尾并且要放在该行分号前,否则就没有效果。 (不过分号前的空格不会影响它)

如果因为一些特殊原因,你不得不在一个代码块中声明两个同样的属性,那么请把!important加在第一个属性后面,因为这样做会让所有浏览器中第一个属性的权重更大,而IE6除外(这是一个只有IE6才有的hack,但是不会影响你的CSS)

在IE6和IE7中如果你使用不同的单词替代!important(像!hotdog),这条CSS样式依然会获得更大的权重,但是其他浏览器却会忽略它。

注意: 

1、IE6及更早浏览器下,!important在同一条规则集内不生效。 

2、如果!important被用于一个简写的样式属性,那么这条简写的样式属性所代表的子属性都会被作用上!important。 

3、关键字!important必须放在一行样式的末尾并且要放在该行分号前,否则就没有效果。

(责任编辑:网站模板)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片