• 列表点击灰色


    <!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>

  • 相关阅读:
    SSM实现mysql数据库账号密码加密连接
    获取系统相关信息 (CPU使用率 内存使用率 系统磁盘大小)
    JavaWeb(一) / /* /**的区别
    IDEA(一) 使用IDEA搭建SSM框架项目
    Mysql连接数据库异常汇总【必收藏】
    Java代理模式及动态代理详解
    SpringBoot集成Thymeleaf
    设计师,程序员,当心字体侵权
    Java开发神器Lombok使用详解
    日期格式化跨年bug,是否与你不期而遇?
  • 原文地址:https://www.cnblogs.com/yangzailu/p/5826885.html
Copyright © 2020-2023  润新知