如何让css样式失效

让css样式失效的方法：1、通过更改元素名称，来达到让此区域css失效的目的；2、通过设置优先级高的css样式来覆盖此css样式使其失效。

本教程操作环境：windows7系统、css3版，DELL G3电脑。

让css样式失效的方法：

一、通过更改元素名称，来达到让此区域css失效的目的

如我们已经为#notice设置了如上的单独样式，可以通过更改元素#notice的名称来取消样式

script src="http://libs.baidu.COM/jquery/2.0.0/jquery.min.js">
    /script>
    script tyPE="text/javascript">
$(function() {
        $("#notice").attr("id", "notice00");
}
    );
    /script>
    

二、通过设置优先级高的css样式来覆盖此css样式使其失效

使用!important提升样式优先级。

!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 class="aa" style="background-color:#cc6600;
    font-size:16px;
    ">
    中Class中包括:!important的样式/div>
     div class="bb" style="background-color:#cc6600">
    不包括的样式/div>
      /body>
      /html>
    

效果图：

相关教程推荐：CSS视频教程

以上就是如何让css样式失效的详细内容，更多请关注其它相关文章！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！