<!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>无标题文档</title><script src="js/myfocus-2.0.1.min.js" type="text/javascript"></script><script src="js/mf-pattern/mF_fancy.js" type="text/javascript"></script><link href="js/mf-pattern/mF_fancy.css" rel="stylesheet"/><script type="text/javascript"> myFocus.set({ id:'picBox' });</script><style> *{margin:0; padding:0; } body{font-family:"微软雅黑";} .content{ width:1000px; margin:0 auto; } .top{ width:1000px; height:70px; margin:3px 0; } .top-left{ width:200px; float:left; } .top-right{ float:left; } .top-right li{ list-style:none; float:left; } .top-right li a{ text-decoration:none; color:#000; display:block; margin:0 13px; width:100px; font-size:20px; text-align:center; line-height:70px; } .top-right li a:hover{ text-decoration:none; color:#fff; background-color:#c93849; } .ad{ height:310px; } .mid-title{ font-size:18px; height:40px; line-height:40px; color:#fff; margin:20px 0; } .mid-title-left{ float:left; background-color:#c93849; width:150px; text-align:center; } .mid-title-right{ float:left; background-color:#333; width:850px; } .mid-title-right a{ color:#fff; text-decoration:none; } .mid-box{ width:1000px; height:151px; } .mid-box a:link,.mid-box a:visited{ color:#333; text-decoration:none; } .mid-box a:hover,.mid-box a:active{ color:#c93849; text-decoration:none; } .mid-box1{ float:left; } .mid-box2{ float:left; margin:0 5px; } .mid-box3{ float:left; } .mid-box-text{ border:1px solid #CCC; text-align:center; font-size:14px; } .main{ width:1000px; height:261px; margin:20px 0 5px 0; font-size:14px; } .main-box1{ width:330px; float:left; } .main-box2{ width:330px; float:left; margin:0 5px; } .main-box3{ width:330px; float:left; } .main h3 { padding-left:20px; background-color:#c93849; font-size:16px; font-weight:normal; height:40px; line-height:40px; } .main h3 a{ color:#fff; text-decoration:none; } .main-box1 ul{ border:1px solid #ccc; } .main-box1 li{ list-style:none; border-bottom:1px solid #ccc; } .main-box1 .data{ float:left; background-color:#c93849; color:#fff; margin:0 5px; height:38px; width:32px; text-align: left; border-radius: 4px; padding:5px 5px; margin-top:5px; } .main-box1 h4{ margin-bottom:5px; } .mian-box-text{ margin:5px auto; } .mian-box-text a:link,.mian-box-text a:visited{ color:#333; text-decoration:none; } .mian-box-text a:hover,.mian-box-text a:active{ color:#c93849; text-decoration:none; } .main-box2 ul{ border:1px solid #ccc; } .main-box2 img{ width:328px; height:150px; } .main-box2 li{ list-style:none; margin:3px auto; } .list li a:link,.list li a:visited{ color:#333; text-decoration:none; } .list li a:hover,.list li a:active{ color:#c93849; text-decoration:none; } .main-box3 .p{ border:1px solid #ccc; padding:5px 10px; } .bottom{ background-color:#CCC; width:1000px; height:60px; text-align:center; line-height:80px; }</style></head><body><div class="content"> <div class="top"> <div class="top-left"><a href="#"><img src="images/logo.jpg" alt="慕课网"/></a></div> <div class="top-right"> <ul> <li><a href="#">首页</a></li> <li><a href="#">产品信息</a></li> <li><a href="#">解决方案</a></li> <li><a href="#">产品价格</a></li> <li><a href="#">帮助中心</a></li> <li><a href="#">关于我们</a></li> </ul> </div> </div><!--top end--> <div class="ad" id="picBox"> <div class="loading"><img src="images/loading.gif" alt="图片加载中"/></div> <div class="pic"> <ul> <li><a href="#"><img src="images/ad2.jpg"/></a></li> <li><a href="#"><img src="images/ad3.jpg"/></a></li> <li><a href="#"><img src="images/ad4.jpg"/></a></li> </ul> </div> </div><!--ad end--> <div class="mid-title"> <div class="mid-title-left">滚动新闻</div> <div class="mid-title-right"><marquee direction="right" onMouseOver="this.stop()" onMouseOut="this.start()"><a href="#">这是滚动新闻</a></marquee></div> </div><!--mid-title end--> <div class="mid-box"> <div class="mid-box1"> <div><a href="#"><img src="images/bs.jpg"/></a></div> <div class="mid-box-text"><a href="#">玩转BootStrap</a></div> </div> <div class="mid-box2"> <div><a href="#"><img src="images/css.jpg"/></a></div> <div class="mid-box-text"><a href="#">企业网站案例</a></div> </div> <div class="mid-box3"> <div><a href="#"><img src="images/js.jpg"/></a></div> <div class="mid-box-text"><a href="#">JavaScript基础</a></div> </div> </div><!--mid-box end--> <div class="main"> <div class="main-box1"> <h3 class="main-box-title"><a href="#">新闻中心</a></h3> <ul> <li> <div class="data">8月<br />23日</div> <div class="mian-box-text"><h4>学习计划之“Android”攻城狮养成</h4><a href="#">想成为Android攻城狮?想开发一款专属App?没有任何基础的你,应该从何学起?</a></div></li> <li> <div class="data">8月<br />23日</div> <div class="mian-box-text"><h4>学习计划之“Android”攻城狮养成</h4><a href="#">想成为Android攻城狮?想开发一款专属App?没有任何基础的你,应该从何学起?</a></div></li> <li> <div class="data">8月<br />23日</div> <div class="mian-box-text"><h4>学习计划之“Android”攻城狮养成</h4><a href="#">想成为Android攻城狮?想开发一款专属App?没有任何基础的你,应该从何学起?</a></div></li> </ul> </div> <div class="main-box2"> <h3 class="main-box-title"><a href="#">热门活动</a></h3> <ul> <a href="#"><img src="images/2048.jpg"/></a> <div class="list"> <li><a href="#">慕课网2048游戏源码征集</a></li> <li><a href="#">慕课网2048游戏源码征集</a></li> <li><a href="#">慕课网2048游戏源码征集</a></li> </div> </ul> </div> <div class="main-box3"> <h3 class="main-box-title"><a href="#">联系我们</a></h3> <div class="p"><p>讲师招募<br />邹同学<br />电话：18911888156<br />QQ:576264119<br />E-mail:daisy@imooc.com</p><br /> <p>网站合作<br />昌同学<br />电话：132261771103<br />QQ:1059809142<br />E-mail:livang@imooc.co</p></div> </div> </div><!--main end--> <div class="bottom"> Copyright © 2013 imooc.com All Rights Reserved 京ICP备 13046642号-2 </div><!--bottom end--></div><!--content end--></body></html>
添加回答
举报
0/150
提交
取消