`

css !important

    博客分类:
  • css
阅读更多

对于!important和它的用法你肯定不陌生。

!important是CSS2提出的,是提升指定样式规则的应用优先权。你可能看到或听说IE6不支持!important,可以用此方法来区分IE6和其他标准浏览器。但我要说的是:IE6支持!important属性,但存在bug。有什么bug呢?实验是最有力的证据,我们就来做实验证实一下。

我们拿以下XHTML代码并用color属性来做实验:

<h2>文字文字</h2>

给它加上颜色

h2{
color:#f00;
}

结果正是我们设置的那样。

设置如下属性:

h2{
color:#f00 !important;
color:#00f;
}

没错,正如你所知道的,这时IE6显示蓝色,而IE7和FF显示红色。查看结果

换个写法:

h2{
color:#f00 !important;
}
h2{
color:#00f;
}

这时你认为会是什么结果呢?是否仍认为在IE6里是蓝色呢?那你错了,这时IE6、IE7和FF都显示红色。查看结果

由此,我们可以得出:在IE6里,重复的属性写在同一对大括号里,后面的将会覆盖前面的,不管上面的属性是否加有!important声明;而写在不同的大括号里,它则会去认加有!important声明的那条属性。

[转:17CSS]

分享到:
评论

相关推荐

    CSS !important 的使用

    important`的使用之前,我们先了解CSS的优先级规则。 在CSS中,样式的选择器有不同的权重,权重越高,其对应的样式越优先被应用。权重计算规则如下: 1. 内联样式(如`style="..."`):权重为1000。 2. ID选择器...

    css中提升优先级属性!important的用法总结

    important` 是一个强大的工具,用于解决CSS优先级的问题,特别是在处理外部和内联样式冲突时。然而,明智地使用它是非常重要的,以保持CSS代码的可维护性和清晰度。在实际项目中,应该尽量通过改进选择器结构来解决...

    CSS中的!important规则:使用指南与最佳实践

    important规则是一个强大的工具,它可以在特定情况下覆盖其他CSS规则。然而,由于其对样式层叠的强烈影响,!important的使用需要谨慎。本文将深入探讨!important的工作原理、使用场景以及如何合理地应用它,以避免...

    通过jquery修改带有!important的样式

    important的样式 #### 背景介绍 在Web开发过程中,我们经常需要动态地改变页面元素的样式。有时候,这些样式是由外部CSS文件定义的,并且某些样式可能使用了`!important`来提高优先级。这在一定程度上限制了...

    强制CSS !important使用介绍

    important`是CSS中一个强大的工具,用于解决样式优先级问题,但应谨慎使用,以免导致样式管理的混乱。在理解和熟练掌握CSS选择器权重的基础上,合理地运用`!important`,可以更好地控制页面的呈现效果。

    原来CSS里的 !important 是如此用法

    important`是一种特殊的权重声明,用于提高CSS属性值的优先级。当一个CSS属性值后面跟上`!important`时,该属性值将获得更高的优先级,即使有更高特异性(specificity)的选择器也无法覆盖它。 #### 二、`!...

    CSS中的!important属性用法

    important`属性,它可以强制一个CSS规则在所有其他规则之上生效。 来看一个具体的例子: ```css #a { margin-left: 30px !important; margin-left: 20px; } ``` 在这个例子中,我们有一个ID为"a"的div元素。在...

    postcss-important:PostCSS插件,用于基于`!important`的注释

    var important = require ( 'postcss-important' ) // CSS to be processed var css = fs . readFileSync ( 'input.css' , 'utf-8' ) // Process CSS var output = postcss ( ) . use ( important ( css ) ) . ...

    CSS下!important属性

    important属性是用于提高CSS规则重要性的关键字,它用以在样式表中强制应用特定的样式声明,确保该声明不受其他同属性值的CSS规则影响。当一个CSS属性后面加上!important时,它会覆盖浏览器层叠样式表中任何同属性的...

    css中!important的作用(IE6 IE7 FF)及其原理

    important`的工作原理是这样的:当一个CSS声明后面加上`!important`时,这个声明的优先级将高于其他没有`!important`的声明,即使这些声明在CSS文件中出现的位置更晚。通常,CSS的优先级由选择器的特异性(selector ...

    如何使用jquery修改css中带有!important的样式属性

    important`的CSS样式时,使用jQuery的`.css("cssText", "...")`方法是一种有效的方法。这种方法可以确保新的样式规则覆盖已有的`!important`规则,从而实现动态样式修改。在实际开发中,应谨慎使用`!important`,...

    从可维护性角度考虑css的!important规则的可用性

    important`的使用在维护大型CSS代码库时可能会带来问题。因为它使得样式优先级变得难以预测,这可能会导致以下挑战: 1. **降低可读性和可理解性**:开发者可能需要花费更多时间来追踪哪些样式被`!important`覆盖,...

    react-embedded-animations:React库可在嵌入式体验中使用动画,其中需要在CSS中使用!important

    React库可以在嵌入式体验上使用动画,而CSS中需要使用!important。 什么时候使用 在大多数情况下,不应使用该库,仅在以下情况下使用: 如果需要在动画CSS上使用!important 安装 npm install --save react-...

    曹鹏CSS视频教程-54.冲突与!important.rar

    important.rar”主要聚焦于CSS中的一个重要主题:样式冲突解决和“!important”规则的使用。CSS(Cascading Style Sheets)是网页设计中不可或缺的一部分,它赋予了HTML文档丰富的表现形式和结构,从而为用户提供更...

    详解CSS样式中的!important、*、_符号

    important、*和_在CSS中均与样式的优先级有关,但在实际的网页设计和开发中,为了保持代码的可维护性和兼容性,我们更推荐使用CSS预处理器、JavaScript以及现代的CSS特性如Flexbox和Grid布局等来处理样式的优先级和...

    CSS中提升优先级属性!important的用法问题总结

    important` 可能导致代码难以维护,因为它破坏了CSS的正常层叠规则。在可能的情况下,优先考虑使用更具体的选择器或嵌套选择器来提升优先级,而不是依赖 `!important`。 2. **正确放置 `!important`**:`!important...

Global site tag (gtag.js) - Google Analytics