转载自:https://www.cnblogs.com/cang12138/p/7326280.html

!important为开发者提供了一个增加样式权重的方法,比直接在元素的 style 属性中设置 CSS 声明还要高, 一般用在 CSS 覆盖 JavaScript设置上。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>测试!Important</title>
</head>
<style type="text/css">
#Box div
{
color: red;
}
.important_false
{
color: blue;
}
.important_true
{
color: blue !important;
}
</style>
<body>
<div id="Box">
<div class="important_false">
这一行末使用important</div>
<div class="important_true">
这一行使用了important</div>
</div>
</body>
</html>

效果:

CSS代码第一行设定了box里面所有div中字体色为红色,第二行和第三行都用class重新定义了自身div的字体色为蓝色,

不同的是,第二行未使用!important,而第三行使用了!

总结:

第一行字体颜色是红色,可以证明,css样式设置中,id的优先级大于class,这行字还是红色。

第二行字体颜色是蓝色,可以证明,!important的优先级最高,important_true的css样式生效,这行字变为了蓝色!

特别说明:

!important在IE6中是不被识别的,例:

.testClass{
    color:blue !important;
    color:red;
}

这种写法在IE6下是识别不到的,.testCalss最后显示为红色,但也可以通过更改下写法让IE6识别到!important

.testClass{
    color:blue !important;
}
.testClass{
    color:red;
}

Css中的!important的更多相关文章

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

    当CSS中含有!important的样式属性时,普通的修改方式是会出现失败的.如下: <div class="test">使用jquery修改css中带有!import ...

  2. 如何利用 jQuery 修改 css 中带有 !important 的样式属性?

    使用 jQuery 修改 css 中带有 !important 的样式属性 外部样式为: div.test { width:auto !important; overflow:auto !import ...

  3. css中的!important作用

    css中的!important作用 一.总结 1.!important:是hack, 2.!important作用:让浏览器首选执行这个语句,当对同一个对象设置了多个同类型的属性的时候,首选执行这一个 ...

  4. CSS中的!important属性用法

    关于CSS的运用技巧有很多, 今天主要探讨一下CSS中 !important 这个属性的用法.在CSS的使用中,遇到最多的问题就是不同浏览器之间的兼容问题. 由于IE并不严格执行W3C标准, 而又几乎 ...

  5. CSS 中的 !important 属性

    !important的作用就是提高指定样式属性的优先级. 一般情况下,我们对同一个元素设置样式属性的时候,对同一个属性设置了两个甚至多个值,像下面这样: p { /* 例1 */ color:red; ...

  6. css中!important的用法

    {*rule !important}这个css规则当今在网页制作的时候的普及已经非常流行了,以前我对它的理解就停留在‘浏览器是否识别阶段’ 而没有真正去研究过,可是现在发生了变化.众所周知,!impo ...

  7. CSS中"!important"的使用

    本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...

  8. CSS中!important的优先级

    本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...

  9. CSS中!important的使用 转

    本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22::) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < 元素 ...

随机推荐

  1. 修改pom项目版本 jenkins 关联 shell命令

    #获取pom文件内的项目版本 version=`awk '/<version>[^<]+<\/version>/{gsub(/<version>|<\/ ...

  2. windows 使用 git 客户端

    git客户端下载地址:https://www.git-scm.com/ tortoisegit下载地址:https://tortoisegit.org/ 双击下载的安装包,默认安装直到完成. 打开gi ...

  3. Anacond的介绍

    Anacond的介绍 Anaconda指的是一个开源的Python发行版本,其包含了conda.Python等180多个科学包及其依赖项. 因为包含了大量的科学包,Anaconda 的下载文件比较大( ...

  4. 【leetcode】516. Longest Palindromic Subsequence

    题目如下: 解题思路:很经典的动态规划题目,但是用python会超时,只好用C++了. 代码如下: class Solution { public: int longestPalindromeSubs ...

  5. python学习笔记(十八)python操作excel

    python操作excel需要安装通过pip安装xlwt, xlrd这两个模块: pip install xlwt pip insall xlrd 操作excel ,写入excel: import x ...

  6. 【GMOJ6377】幽曲[埋骨于弘川]

    Description \(n\in[1,500],k\in[2,10]\). Solution 这是一道有点很有难度的题. 先考虑判断一个数是否在数列\(a\)中.由于每次加的数是在\([0,k)\ ...

  7. JavaScript清空数组的三种方法

    [文章系摘自网络,看到有用记录在博客,同时共享给大家] 原链接:http://www.2cto.com/kf/201409/335383.html 方式1,splice   var ary = [1, ...

  8. 给数据库用户授权(对象多为系统表,如dba可以查看的表)

    我们知道,创建一个新用户时,网上各种的帖子包括书籍中经常用到一个grant connect,resource to user;,这样才能用这个用户登录数据库,那么这条语句的真正作用是什么呢? 首先,g ...

  9. Alisha’s Party

    Alisha’s Party Time Limit: 3000/2000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others) ...

  10. 设置Select下拉多选框功能,赋值与绑定问题

    项目需要所以更改select为多选下拉的菜单选项. 我用的是后台直接绑定 在前台aspx页面直接写一个 <div id="dropsxs" runat="serve ...