zoukankan      html  css  js  c++  java
  • 如何使样式CSS不被覆盖 !important

    在合作的过程中,经常会遇到这样的问题,别人做的样式CSS,要保留它的基础上自己添加

    然后添加了 发现没有覆盖别人而被别人覆盖了

    遇到这样的问题的时候,我们可以这样解决

    代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <title>Untitled Document</title>  
    <style type="text/css">  
    .aa{  
            font-family: Verdana, Arial, Helvetica, sans-serif;  
            font-size: 12px;  
            background-color: #FF0000 !important  
    }  
    .bb{  
            font-family: Verdana, Arial, Helvetica, sans-serif;  
            font-size: 12px;  
            background-color: #FF0000;  
    }  
    </style>  
    </head>  
    <body>  
    以下两个DIV的样式基本一样,但是第一个的外挂(理解俺的意思就行了)样式:background-color后面加了一个 !important,所以,虽然第一个DIV行内(in line)CSS也定义了background-color,但是却是参照外挂的background-color,其它的没有指定 !important 的,就被行内的STYLE覆盖掉了.  
    <div class="aa" style="background-color:#cc6600;font-size:16px;">中Class中包括:!important的样式</div> <div class="bb" style="background-color:#cc6600">不包括的样式</div>  
    </body>  
    </html> 
    

    效果:

    以下两个DIV的样式基本一样,但是第一个的外挂(理解俺的意思就行了)样式:background-color后面加了一个 !important,所以,虽然第一个DIV行内(in line)CSS也定义了background-color,但是却是参照外挂的background-color,其它的没有指定 !important 的,就被行内的STYLE覆盖掉了.
    中Class中包括:!important的样式
    不包括的样式

  • 相关阅读:
    内存问题定位与解决
    CPU问题定位与解决
    数据库优化案例——————某市中心医院HIS系统
    系统隐形杀手——阻塞与等待
    SQL Server常见问题介绍及快速解决建议
    CVTE实习感想--2014.10秋招
    Spring AOP的理解
    一些Java面试问题
    举几个大数据的例子
    Java中乐观锁与悲观锁的实现
  • 原文地址:https://www.cnblogs.com/zcy_soft/p/1995365.html
Copyright © 2011-2022 走看看