zoukankan      html  css  js  c++  java
  • 列表点击灰色

    <!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>
      <title> new document </title>
      <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
      <link rel="stylesheet" type="text/css" href="" />
      <style type="text/css">
      body, div, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dd, dt, img, form { padding:0px; margin:0px; border:0; font-size:14px; }
      h1, h2, h3, h4, h5, h6 { font-size:14px; font-weight:100; margin-top:0px !important; margin-bottom:0px !important;}
      ul li {list-style:none;}
      a{text-decoration:none;}
      .box{width:100%;back-ground:#F2F2f2;}
      .content{width:1000px;height:500px;margin:0 auto;background-color:#FFF;}
      .qe li a{ font-size:14px; color:#000000;width:176px;font-weight:bolder;  text-align:center;display:block; height:40px; border:solid 1px #E5E5E5; border-top:0px solid #E5E5E5;line-height:40px; }
      .qe li a:hover{ font-size:15px; color:#C30D23;background:#fff;}
      .yang{background: #EAE9E7;}
      </style>
      <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
      <script type="text/javascript">
          $(function(){
          $(".shx").click(function(){
           $(this).addClass('yang').siblings().removeClass("yang");
         });
         $('#zcc').addClass('yang');
     });
      </script>
     </head>
    
     <body>
      <div class="box">
            <div class="content">
            <div style="176px;background-color:#EAE9E7;">
                    <div>
                            <img src="about.png" style="176px;">
                    </div>
                    <div class="qe" style="float:left;176px;">
                            <ul>
                                <li class="shx" id="zcc"><a href="#">企业简介</a></li>
                                <li class="shx"><a href="#">公司资质</a></li>
                                <li class="shx"><a href="#">平台公告</a></li>
                                <li class="shx"><a href="#">行业新闻</a></li>
                                <li class="shx"><a href="#">招贤纳士</a></li>
                                <li class="shx"><a href="#">合作伙伴</a></li>
                                <li class="shx"><a href="#">联系我们</a></li>
                            </ul>
                    </div>
            </div>
            </div>
      </div>
     </body>
    </html>

  • 相关阅读:
    npm 常用命令
    jquery 滚动事件
    移动端触控事件封装(完整版)
    带动画的分页
    手机号码 座机号码验证
    js常用 弹出确认 取消对话框
    jQuery之select的option怎样绑定事件
    jQuery如何停止元素的animate动画,还有怎样判断是否处于动画状态
    jQuery live()方法使用及变更(事件委托)
    Could not publish server configuration for Tomcat v6.0 Server at localhost. Multiple Contexts have a path of "/tm".
  • 原文地址:https://www.cnblogs.com/yangzailu/p/5826885.html
Copyright © 2011-2022 走看看