1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>博雅互动</title> 6 <style class="text/css"> 7 *{ 8 margin: 0px; 9 padding: 0px; 10 } 11 .header{ 12 width: 100%; 13 height:58px; 14 background: black; 15 } 16 .top{ 17 width: 1000px; 18 height: 58px; 19 margin: 0px auto; 20 } 21 .top li{ 22 width:100px; 23 height: 58px; 24 line-height: 58px; 25 font-size: 14px; 26 list-style: none; 27 float: left; 28 text-align: center; 29 } 30 a{ 31 text-decoration: none; 32 color: #f0f0f0; 33 } 34 .top li a:hover{ 35 color: red; 36 } 37 .top .top_img{ 38 width: 184px; 39 } 40 .top .top_footer{ 41 width: 134px; 42 background: url(images/jrwm.png) no-repeat center center; 43 } 44 .center{ 45 width: 100%; 46 height: 465px; 47 background: url(images/banner.jpg) center; 48 } 49 .bottom{ 50 width:1200px; 51 height: 280px; 52 margin: 0px auto; 53 } 54 .bottom div p a{ 55 color:#00ff00; 56 } 57 .bottom .bottom_1{ 58 width: 218px; 59 height: 130px; 60 font-weight: bold; 61 text-align:center; 62 margin:50px 40px; 63 float: left; 64 } 65 p{ 66 font-size: 5px; 67 margin-top: 10px; 68 color: green; 69 } 70 .footer{ 71 width:1000px; 72 height: 420px; 73 margin: 0px auto; 74 border-top: 1px solid #a0a0a0; 75 } 76 .footer .xinwen{ 77 width:500px; 78 height: 310px; 79 margin-top: 50px; 80 background: url(images/bynewsbg.jpg) no-repeat; 81 float: left; 82 } 83 .xinwen ul{ 84 margin-top: 120px; 85 list-style-type: none; 86 margin:120px 50px 0px 50px; 87 } 88 .xinwen li{ 89 border-bottom: 1px solid #f0f0f0; 90 width: 400px; 91 height: 30px; 92 line-height: 30px; 93 font-size: 16px; 94 font-family: "黑体"; 95 padding:7px 0px 7px 7px; 96 } 97 .xinwen li a{ 98 99 color: black; 100 101 } 102 .xinwen li span{ 103 float: right; 104 color: #a0a0a0; 105 } 106 .footer .zhaopin{ 107 width:500px; 108 height: 310px; 109 margin-top: 50px; 110 float: right; 111 background: url(images/zczp.jpg) no-repeat; 112 } 113 .zhaopin h1{ 114 width: 500px; 115 height: 50px; 116 text-align: center; 117 color: black; 118 } 119 .zhaopin .gw{ 120 margin-top: 60px; 121 width: 300px; 122 height:190px; 123 } 124 .zhaopin .gw ul{ 125 margin-left: 15px; 126 list-style-type:none; 127 } 128 129 .zhaopin ul li{ 130 width: 400px; 131 height: 42px; 132 line-height: 30px; 133 font-size: 16px; 134 } 135 .zhaopin ul a{ 136 color: black; 137 } 138 .zhaopin ul a:hover{ 139 color: white; 140 } 141 </style> 142 </head> 143 <body> 144 <div class="header"> 145 <div class="top"> 146 <ul> 147 <li class="top_img"><a href="#"><img src="images/logo.png" /></a></li> 148 <li><a href="#">首页</a></li> 149 <li><a href="#">博雅游戏</a></li> 150 <li><a href="#">博雅新闻</a></li> 151 <li><a href="#">关于我们</a></li> 152 <li><a href="#">客服中心</a></li> 153 <li><a href="#">投资者关系</a></li> 154 <li class="top_footer"></li> 155 </ul> 156 </div> 157 </div> 158 <div class="center"></div> 159 <div class="bottom"> 160 <div class="bottom_1"><img src="images/bpt1.jpg"><br/>BPT宣传片<br/><p><a href="#">点击播放</a> <img src="images/xjt.png"></p> 161 </div> 162 <div class="bottom_1"><img src="images/bpt1.jpg"><br/>BPT宣传片<br/><p><a href="#">点击播放</a> <img src="images/xjt.png"></p> 163 </div> 164 <div class="bottom_1"><img src="images/bpt1.jpg"><br/>BPT宣传片<br/><p><a href="#">点击播放</a> <img src="images/xjt.png"></p> 165 </div> 166 <div class="bottom_1"><img src="images/bpt1.jpg"><br/>BPT宣传片<br/><p><a href="#">点击播放</a> <img src="images/xjt.png"></p> 167 </div> 168 </div> 169 <div class="footer"> 170 <div class="xinwen"> 171 <ul> 172 173 <li><a href="#">深圳市政协副主席徐友军一行莅临博雅相互调研</a><span>9/23</span></li> 174 <li><a href="#">深圳市政协副主席徐友军一行莅临博雅相互调研</a><span>9/23</span></li> 175 <li><a href="#">深圳市政协副主席徐友军一行莅临博雅相互调研</a><span>9/23</span></li> 176 <li><a href="#">深圳市政协副主席徐友军一行莅临博雅相互调研</a><span>9/23</span></li> 177 </ul> 178 </div> 179 <div class="zhaopin"> 180 <h1>专场招聘</h1> 181 <div class="gw"> 182 <h2>专场招聘岗位</h2> 183 <ul> 184 <li><a href="#">PHP开发工程师</a></li> 185 <li><a href="#">C++开发工程师</a></li> 186 <li><a href="#">WEB前端开发工程师</a></li> 187 <li><a href="#">大数据开发工程师</a></li> 188 </ul> 189 </div> 190 </div> 191 </div> 192 193 </body> 194 </html>