第一个网页作品

来源：互联网发布：es6数组删除指定元素编辑：程序博客网时间：2024/04/28 05:33

<!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="en"><head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><title>博雅浏览器</title><link  rel="stylesheet" type="text/css" href="style/index.css">    <style type="text/css">.style1 {font-size: 12px}    </style></head><body><div class="header"><div class="logo"><h1><a href="http://www.boyaa.com" title="博雅互动网">博雅互动网</a></h1>           </div>     </div>        <div class="nav1">     <a href="http://www.boyaa.com/game.html" title="祝大家">首页</a>     </div>     <div class="nav2">        <a href="http://www.boyaa.com/news.html" title="在">博雅游戏</a>     </div>     <div class="nav3">        <a href="http://www.boyaa.com/news.html" title="新的">博雅新闻</a>     </div>     <div class="nav4">        <a href="http://www.boyaa.com/about.html" title="一年里">关于我们</a>     </div>     <div class="nav5">        <a href="http://www.boyaa.com/services.html" title="身体健康">客服中心</a>     </div>     <div class="nav6">        <a href="http://www.boyaa.com.hk/s/investor.php" title="万事如意">投资者关系        </a>     </div>     <div class="nav7">     <div class="buttom">     <h1><a href="http://join.boyaa.com/" title="美女们!快来吧!">加入我们</a></h1>     </div>     </div>         <div class="photo1">         <a href="https://www.nuomi.com/" title="走过路过,千万不要错过!">帅帅哒</a>     </div>     <div class="photo2">         <a href="http://www.sohu.com/" title="黄老师是大家的小鲜肉!">美美哒</a>     </div>     <div class="photo3">         <a href="http://www.4399.com/" title="杨老师是大家的女神!">哈哈哈</a>     </div>     <div class="photo4">         <a href="http://www.7k7k.com/" title="来来来,我是你的宝贝!">嘻嘻嘻</a>     </div>     <section class="photonews">      <article class="indexnewscon">          <ul class="newslist c1">            <li class="c1">              <a href="http://www.baidu.com">博雅互动受邀出席2016中国移动全球合作伙伴大会</a>             <span class="time">12 / 20</span>            </li>            <li class="cl">              <a href="http://www.4399.com">2016BPT海天盛筵站冠军出炉，新丝路模特“惊艳”决赛赛场</a>              <span class="time">12 / 11</span>            </li>            <li class="cl">               <a href="http://www.codecombat.cn/play/level/gems-in-the-deep">博雅互动公布2016第三季度业绩  公司收益稳步增长</a>                <span class="time">11 / 29</span>            </li>            <li class="cl">                            <a href="http://mediaqueri.es/">博雅互动牵手“海天盛筵”展会，打造高端棋牌竞技赛事</a>                <span class="time">11 / 09</span>            </li>           </ul>                          </article>     </section>     <div class="photowoman">        <div class="stit">                <h1>专场招聘</h1>                <p>BOYAA JOBS</p>            </div>            <article class="recruit">                <h3>专场招聘岗位：</h3>                <a href="http://sports.sina.com.cn/nba/">                <ul class="recruitlist">                    <li>PHP开发工程师 </li>                    <li>C++开发工程师 </li>                    <li>WEB前端开发工程师</li>                    <li>大数据开发工程师</li>                </ul>                </a>             </article>     </div>     <div class="photobottom">           <nav class="area">                 <span class="copyright">Copyright © 2004 - 2016 博雅互动(Boyaa Interactive)                       <a target="_blank" href="http://www.miibeian.gov.cn/">粤ICP备05062536号                      </a>                        网络文化经营许可证：粤网文[2015]1991-405号  增值电信业务经营许可证：粤B2-20110513                       <a target="_blank" href="http://szcert.ebs.org.cn/3a08cc75-94e5-4d0c-b6ae-92a13a947618">                           <img style="border-width:0px;border:hidden; border:none;" alt="深圳市市场监督管理局企业主体身份公示" title="深圳市市场监督管理局企业主体身份公示" src="http://szcert.ebs.org.cn/Images/govIcon.gif" width="36" height="50" border="0">                      </a>                      <script src="http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js" type="text/javascript">                                                        </script>                </span>                 <span class="fl">                       <a href="http://map.baidu.com/">网站地图</a> |                       <a href="https://www.baidu.com/duty/index.html">免责声明</a>                 </span>             </nav>     </div>     <div class="MORE1">            <a href="http://www.boyaa.com/news.html" title="更多">MORE1</a>     </div>     <div class="MORE2">            <a href="http://www.webhek.com/misc/3d-album/" title="程序员给女朋友的礼物">MORE2</a>     </div>     </body></html>

*{margin:0;padding: 0;}body{font:12px/150% "宋体",arial;color: black;background:url(../images/banner.jpg) center 60px no-repeat;}/*h1,h2,h3,h4,h5,h6{font-size: 100%;}  /*就是让所有的h标题和body字体大小一样大*/*/img{border:0;display:block;}  /*清除图片底侧数据*/ul,ol{list-style: none;} /*把列表中的小点去掉*/a{text-decoration:none;color: #444866;} /*链接属性*/a:hover{text-decoration: underline;} /*链接下划线*/.clearfix:after{  content: "";  display: block;    height: 0;    visibility: hidden;    clear: both;} /* .clearfix{zoom:1;} */ .header{ width: 230px; height: 60px; background-color: #191D3A; padding: 0 0 0 175px; float:left; } .logo{ width: 174px; height: 58px; background: url(../images/logo.png) no-repeat; text-indent:-9999em;  } .logo a{ display: block; height: 58px;  } .nav1,.nav2,.nav3,.nav4,.nav5,.nav6{   width: 90px;   height: 36px;   background: #191D3A;   float: left;   text-align: center;   padding-top:24px;    font-size:14px;    color: #c0c0c0;    font-family: Georgia;    border-right-style: inset;    border-right-width: 1px;    border-right-color: #c0c0c0; } .nav7{ width: 254px; height: 48px; background: #191D3A; position: absolute;  left: 951px;  top: 0px; padding: 12px 0 0 138px; } .buttom{ width:100px; height:34px; background: url(../images/button.png) no-repeat; text-indent:-9999em; } .buttom a{ display: block; height: 34px; }  a:hover { text-decoration: none; color: #33b972; }   .photo1{  height:128px;  width: 218px;  background: url(../images/bpt.jpg) no-repeat;   position: absolute;  left: 172px;  top: 568px;  text-indent:-9999em; } .photo1 a{  display: block;  height: 128px; } .photo2{  height:128px;  width:218px;  background: url(../images/video.jpg) no-repeat;  position:absolute;  left: 433px;  top: 568px;  text-indent: -9999em; } .photo2 a{  display: block;  height:128px; } .photo3{  height: 128px;  width: 218px;  background: url(../images/gamepic3.jpg) no-repeat;  position: absolute;  left:694px;  top:568px;  text-indent:-9999em; } .photo3 a{  display: block;  height: 128px; } .photo4{  height: 128px;  width: 218px;  background: url(../images/gamepic1.jpg) no-repeat;  position: absolute;  left:955px;  top:568px;  text-indent: -9999em; } .photo4 a{  display:block;  height: 128px; } .photonews{  height: 278px;  width: 488px;  background:url(../images/bynewsbg.jpg);  position: absolute;  left: 191px;  top: 834px; } .photowoman{  height: 278px;  width: 450px;  background: url(../images/byhrbg3.jpg);  position: absolute;  left: 678px;  top: 834px; } .photobottom{  height: 128px;  width: 100%;  background-color: #191D3A;  position: absolute;  top: 1163px; } .MORE1{  height: 25px;  width: 59px;  background:url(../images/more.png);  position: absolute;  top: 882px;  left: 402px;  text-indent: -9999em; } .MORE1 a{  display:block;  height: 25px; } .MORE2 {   height: 25px;  width: 59px;  background:url(../images/more2.png);  position: absolute;  top: 868px;  left: 882px;  text-indent: -9999em; } .MORE2 a{  display:block;  height: 25px; } .indexnewscon{  width: 487px;  height: 158px; /*  background-color: black; */  position: absolute;  top:120px;  left: 0px;  padding: 0 20px;   padding-left: 20px;  } .newslist li{  border-bottom: 1px solid #dbele7;   padding:10px 0;  font-size: 1.166em;  line-height: 20px; } .newslist li .time {   margin-left: 18px;   color: #afbecf;   font-size: 12px;  } .stit{  width: 125px;  height: 40px;  position:absolute;  top:35px;  left: 68px; } .stit h1{  font-size: 28px;  font-family: 粗体;  display: block;  line-height: 34px;  font-weight: 700px;  color:#fff; } .stit p{  font-family: Roman;  color:#fff;   font-size: 12px;  margin-left: 3px;  } .recruit{  width: 290px;  height: 180px;  position:absolute;  top:100px;  left: 20px; } .recruitlist li {  border-bottom: 1px solid #dbele7;  font-size: 1.16em;  line-height: 34px;  color:#fff;  font-family: 宋体; } .recruit h3{   color: #fff;  } .area{  width: 958px;  height: 46px;  position: absolute;  top: 10px;  left: 230px;  color:#444866; }

1 0