首页 > 代码库 > 传智官网

传智官网

      /*全局样式设置 */
body,ul,li,h4,a{margin:0; padding:0;}
ul,li,ol{list-style:none;}
a:link,a:visited{color:#444;text-decoration:none;}
                 
a:hover{color:red;}
img{border:0;}
body{
    background:green; 
    font-size:12px;
    color:#444;
    font-family:Arial,宋体;
    background:#ccc url(../images/bg-body.gif) repeat-x;
    }

.box{width:1000px;height:500px; margin:0px auto; }

  #red{color:red;} 
    
    
    

/*top  */
.top{height:27px; line-height:27px;}
.top span{float:left;color:#01c47c}
 .top ul{float:right;} 
 .top li{float:left;}
  a{border-right:1px dotted #444;padding:0 8px;}
   #noline{border:noline;}



/* logo*/
.logo{height:122px; }
.logo .div1{width:210;height:99px;
float:left; padding-top:23px;}
.logo .div2{ width:400px;height:122px;
float:right;}
.logo .div3{width:360px;height:106px;
float:right; padding-top:16px;}        
.logo .div2 h4{color:#0174c7;font-size:28px;
}
.logo .div2 li{width:79px;height:20px;line-height:20px;
             color:#f00;font-size:15px;
              background:url(../images/li01.png) 
              no-repeat; padding-left:6px; 
              float:left;padding-right:5px;}

<!--menu-->
.menu{height:47px; line-height:47px;border:1px solid #f00;}
 .menu li{border:1px solid red;float:left;}
.menu a{color:#fff; font-weight:bold; 
        width:73px; height:31px; display:block;text-align:center;
        border:1px solid #f00;padding-top:16px;
        }

.menu a:hover{background:url(../images/menu2.gif) no-repeat center
              center;}
 .menu a1{width:90px; }
 .menu a1:hover{background:url(../images/menu1.gif) no-repeat;}
<!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" xml:lang="zh-cn">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>网页标题</title>
    <meta name="keywords" content="关键字列表" />
    <meta name="description" content="网页描述" />
    <link rel="stylesheet" type="text/css" href=http://www.mamicode.com/"css/css.css" />
    <style type="text/css"></style>
    <script type="text/javascript"></script>
</head>
<body>
<div class="box">
<!-- top -->
    <div class="top">
      <span>专业的培训机构<img src=http://www.mamicode.com/"images/hot.gif"></span>
      <ul>
            <li><a href=http://www.mamicode.com/"#">就业宣言</a></li>
            <li><a href=http://www.mamicode.com/"#">报名流程</a></li>
            <li><a href=http://www.mamicode.com/"#">免费公开课</a></li>
            <li><a href=http://www.mamicode.com/"#" id="red">中国好毕设</a></li>
            <li><a href=http://www.mamicode.com/"#">免费学习光盘</a></li>
            <li><a href=http://www.mamicode.com/"#">原创教材</a></li>
            <li><a href=http://www.mamicode.com/"#">创智特刊</a></li>
            <li><a href=http://www.mamicode.com/"#">人才服务</a></li>
            <li><a href=http://www.mamicode.com/"#" id="noline">技术论坛</a></li>
      </ul>
    </div>
<!--top over -->


<!--logo-->
<div class="logo">
    <div class="div1"><img src=http://www.mamicode.com/"images/logo.gif"></div>
    <div class="div3"><img src=http://www.mamicode.com/"images/topword.gif"></div>         <div class="div2">
        <h4>PHP学院</h4>
        <ul>
            <li>北京校区</li>
            <li>上海校区</li>
            <li>广州校区</li>
            <li>深圳校区</li>
        </ul>
    </div>
</div>


<!--menu-->
<div class="menu">
    <ul>
        <li><a href=http://www.mamicode.com/"#">首页</a></li>
        <li><a href=http://www.mamicode.com/"#" class="a1">PHP视频课程</a></li>
        <li><a href=http://www.mamicode.com/"#">PHP视频</a></li>
        <li><a href=http://www.mamicode.com/"#">PHP视频</a></li>
        <li><a href=http://www.mamicode.com/"#">PHP视频</a></li>
        <li><a href=http://www.mamicode.com/"#">PHP视频</a></li>
        <li><a href=http://www.mamicode.com/"#">PHP视频</a></li>
        <li><a href=http://www.mamicode.com/"#">PHP视频</a></li>
        <li><a href=http://www.mamicode.com/"#">PHP视频</a></li>
        <li><a href=http://www.mamicode.com/"#">PHP视频</a></li>
        
    </ul>
</div>
<!--menu over-->











</div>

</body>
</html>

 

传智官网