人生中第一次做的网页，留个纪念
Posted 丶白
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了人生中第一次做的网页，留个纪念相关的知识，希望对你有一定的参考价值。
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>无标题文档</title> 6 <style> 7 * { 8 margin: 0px; 9 padding: 0px;} 10 #shang 11 { 12 min-width:1000px; 13 width:1400px; 14 height:135px; 15 position:relative; 16 } 17 #di 18 { 19 height:150px; 20 min-width:1000px; 21 background-color:#1a252b; 22 /*border:1px solid #F00;*/ 23 position:relative; 24 background-repeat:no-repeat;} 25 #bei 26 { 27 background-image:url(%E8%83%8C%E6%99%AF4.png); 28 /*background-attachment: fixed;*/ 29 background-size: 100%; 30 height:1800px; 31 min-width:1000px; 32 background-repeat:no-repeat;} 33 .logo1 34 { 35 width:350px; 36 height:60px; 37 position:relative; 38 /*border:1px solid #F00;*/ 39 margin-left:15%; 40 margin-top:30px;} 41 .xinde 42 { 43 width:800px; 44 height:320px; 45 position:relative; 46 border-radius:20px; 47 /*border:1px solid #F00;*/ 48 margin-left:20%; 49 margin-top:30px; 50 overflow:hidden;} 51 #datu 52 { 53 width:800px; 54 height:449px; 55 position:relative; 56 /*border:1px solid #0C3;*/ 57 margin:30px auto; 58 overflow:hidden;}/*超出部分隐藏*/ 59 #ta 60 { 61 margin-left:0px; 62 transition:0.7s;} 63 .lr 64 { 65 position:absolute; 66 top:130px; 67 width:32px; 68 height:32px; 69 z-index:99;} 70 #left 71 { 72 left:10px; 73 } 74 #right 75 { 76 right:10px; 77 } 78 #logo 79 { 80 background-image:url(logo2.png); 81 background-repeat: no-repeat; 82 background-size: contain; 83 /*border:1px solid #3F3;*/ 84 position:relative; 85 top:30px; 86 margin-left:100px; 87 height: 60px; 88 background-position: center center; 89 width: 180px; 90 z-index: 99;} 91 #you 92 { 93 width:850px; 94 height:60px; 95 /*border:1px solid #3F3;*/ 96 position:absolute; 97 float:right; 98 right:40px; 99 top:30px; 100 line-height: 60px;} 101 #youzuo { 102 width: 650px; 103 height: 60px; 104 line-height: 60px; 105 position: absolute; } 106 li { 107 float: left; 108 color: #FFF; 109 margin-left: 20px; 110 list-style: none; 111 cursor: pointer;/*变手指*/} 112 a { 113 color: #FFF; 114 cursor: pointer; 115 text-decoration: none;} 116 .xiao { 117 background-position: left; 118 background-repeat: no-repeat; 119 background-size: 20px; 120 } 121 #youyou { 122 width: 220px; 123 height: 60px; 124 position: absolute; 125 top: 0px; 126 right: 0px;} 127 .anniu { 128 width: 60px; 129 height: 30px; 130 border-radius: 5px; 131 position: relative; 132 float: left;/*流式布局向左对齐*/ 133 margin-left: 10px; 134 top: 15px; 135 line-height: 30px;/*行高*/ 136 text-align: center;} /*横向居中*/ 137 #deng { 138 color: #FFF; 139 background-color: #F90; 140 cursor: pointer;} 141 #zhu { 142 color: #F90; 143 transition: 0.5s;/*延迟多少秒之后变化*/ 144 cursor: pointer;} 145 #zhu:hover { 146 color: #FFF; 147 background-color: #F90;} 148 #divtop { 149 height: 40px; 150 width: 100%; 151 background-color: #000; 152 /*position: fixed;*//*悬浮*/ 153 top: 0px; 154 left: 0px; 155 z-index: 99; 156 } 157 #beizhong1 158 { 159 width:286px; 160 height:69px; 161 /*border:1px solid #039;*/ 162 position:relative; 163 margin-left:200px; 164 margin-top:150px; 165 overflow:hidden;} 166 #beizhong2 167 { 168 width:343px; 169 height:48px; 170 /*border:1px solid #039;*/ 171 position:relative; 172 margin-left:200px; 173 margin-top:20px; 174 overflow:hidde1n;} 175 .tou 176 { 177 height:100px; 178 width:100%; 179 line-height:100px; 180 /*border:1px solid #609;*/ 181 margin-top:200px;} 182 /*.touming 183 { 184 opacity:0.5; 185 height:100px; 186 width:100%; 187 position:absolute; 188 background-color: #141c1e; 189 margin-left:0px; 190 margin-top:0px;} */ 191 .tubiao 192 { 193 width:70px; 194 height:70px; 195 line-height:70px; 196 position:absolute; 197 margin-left:260px; 198 cursor: pointer;} 199 .tubiao1 200 { 201 width:70px; 202 height:70px; 203 line-height:70px; 204 position:absolute; 205 margin-left:500px; 206 cursor: pointer;} 207 .tubiao2 208 { 209 width:70px; 210 height:70px; 211 line-height:70px; 212 position:absolute; 213 margin-left:740px; 214 cursor: pointer;} 215 .tubiao3 216 { 217 width:70px; 218 height:70px; 219 line-height:70px; 220 position:absolute; 221 margin-left:980px; 222 cursor: pointer;} 223 .wenzi 224 { 225 position:absolute; 226 bottom:-50px;} 227 .a1:link 228 { 229 color:#FFF; 230 text-decoration:none; 231 } 232 .a1:visited 233 { 234 color:#FFF; 235 text-decoration:none; 236 } 237 .a1:hover 238 { 239 color:#F90; 240 text-decoration:none; 241 } 242 #sou 243 { 244 width:150px; 245 height:25px; 246 border:1px solid #FFF; 247 border-radius:20px; 248 position:absolute; 249 top:107px; 250 right:150px;} 251 .touming 252 { 253 background-color:#dc2d2d; 254 position:relative; 255 top:35px; 256 height:35px; 257 width:753px; 258 line-height:35px;} 259 </style> 260 </head> 261 262 <body> 263 <div id="bei"> 264 <div id="shang"> 265 <div id="logo"></div> 266 <div id="you"> 267 <div id="youzuo"> 268 <ul> 269 <li><a href="#" style="color:#37cff4;"> 270 <div class="xiao"><b> 官网首页</b></div> 271 </a></li> 272 <li><a href="游戏大厅.html"> 273 <div class="xiao"><b> 游戏介绍<b></div> 274 </a></li> 275 <li><a href="#"> 276 <div class="xiao"><b> 下载中心</b></div> 277 </a></li> 278 <li><a href="#"> 279 <div class="xiao"><b> 最新活动</b></div> 280 </a></li> 281 <li><a href="论坛.html"> 282 <div class="xiao"><b> 玩家论坛</b></div> 283 </a></li> 284 </ul> 285 </div> 286 <div id="youyou"> 287 <div class="anniu" id="deng"><a href="登陆.html">登陆</a></div> 288 <div class="anniu" id="zhu"><a href="注册.html">注册</a></div> 289 </div> 290 </div> 291 <div id="sou"> 292 <input type="text" placeholder="搜索" style="background:none; color:#FFF; font-size:15px; height:22px; width:120px; border:none; position:relative; top:1px; left:5px;" /> 293 <img src="../智博星主页_files/searchIcon.png" style="position:absolute; top:3px; right:7px;" /> 294 </div> 295 <div class="touming"><marquee scrollamount="15"><a style="color:#FF0; font-size:20px;"><b>ヾ(o◕∀◕)ﾉヾ狙击者Ⅰ三周年活动火爆进行中，海量虚拟货币道具正在发放，更有现金红包大奖在等着你们；详情请关注我们的活动中心。ヾ(ﾟ∀ﾟゞ)</b></a></marquee></div> 296 </div> 297 <div id="beizhong1"><img src="../../1478232080_231357.png" /></div> 298 <div id="beizhong2"><img src="../../1478234796_687269.png" /></div> 299 <div class="tou"> 300 <ul> 301 <li> 302 <a class="a1" href="#"><div class="tubiao" style="background-image:url(../../logo5.png)"><div class="wenzi"><b>游戏充值 303 </b></div></div></a></li> 304 <li> 305 <a class="a1" href="#"><div class="tubiao1" style="background-image:url(../../logo4.png)"><div class="wenzi"><b>CDK兑换</b></div></div></a></li> 306 <li> 307 <a class="a1" href="#"><div class="tubiao2" style="background-image:url(../../logo3.png)"><div class="wenzi"><b>作战指南</b></div></div></a></li> 308 <li> 309 <a class="a1" href="#"><div class="tubiao3" style="background-image:url(../../logo2.png)"><div class="wenzi"><b>团队对抗</b></div></div><a></li> 310 </ul> 311 <!-- <div class="touming"></div>--> 312 </div> 313 <div class="logo1"><img src="精彩画面.png" /></div> 314 <div id="datu" onmouseover="pause()" onmouseout="conti()"><!--鼠标悬浮跟移除--> 315 <table id="ta" cellpadding="0" cellspacing="0"> 316 <tr> 317 <td><img src="图8.jpg" /></td> 318 <td><img src="图7.jpg" /></td> 319 <td><img src="图6.jpg" /></td> 320 <td><img src="图5.jpg" /></td> 321 <td><img src="图4.jpg" /></td> 322 </tr> 323 </table> 324 </div> 325 <div class="logo1"><img src="游戏心得.png" /></div> 326 <div class="xinde"> 327 <table cellpadding="0" cellspacing="0" > 328 <tr> 329 <td>今日推荐：</td> 330 </tr> 331 <tr> 332 <td> </td> 333 </tr> 334 <tr> 335 <td><a class="a1" href="#">1：新手推荐：3天速成通关困难级所以关卡及隐藏BOSS攻略。 336 </a></td> 337 </tr> 338 <tr> 339 <td><a style="float:right">2016-11-11</a></td> 340 </tr> 341 <tr> 342 <td><a class="a1" href="#">2：大神分享：3人组3分31秒极速通关SSS级任务："杀戮之地"高级攻略。</a></td> 343 </tr> 344 <tr> 345 <td><a style="float:right">2016-11-11</a></td> 346 </tr> 347 <tr> 348 <td><a class="a1" href="#">3：玩家专访：国服第一女枪王Alice做客直播间，与玩家交流心得。 349 </a></td> 350 </tr> 351 <tr> 352 <td><a style="float:right">2016-11-11</a></td> 353 </tr> 354 <tr> 355 <td> </td> 356 </tr> 357 <tr> 358 <td><a class="a1" href="#" style="float:right">更多资讯┉┉</a></td> 359 </tr><br /> 360 <tr> 361 <td height="130px"><a href="#"><marquee scrollamount="10" ><img src="战地1.jpg"/><img src="战地4.jpg" /><img src="战地2.jpg" /><img src="战地5.jpg" /></marquee></a></td> 362 </tr> 363 </table> 364 </div> 365 <div id="di"> 366 <table cellpadding="0" cellspacing="0" > 367 <tr> 368 <td height="150px" width="200px"></td> 369 <td width="200px"><img src="logo2.png" width="200" /></td> 370 <td width="50px"></td> 371 <td> 372 <table> 373 <tr><a style="float:right; font-size:9px; color:#CCC;">关于我们 | 免责声明 | 客服中心 | 未成年人家长监护 | 狙击者Ⅰ | 汉企网 | 黑科技 | 沙发网 | 纳米核心 </a></tr> 374 <tr><a style="float:right; font-size:9px; color:#CCC;">B1.B2-20120154 | 沪网文[2014]0745-175号 | 沪ICP备11033765号 | 科技与数字[2011]208号 </tr> 375 <tr><a style="float:right; font-size:9px; color:#CCC;">Copyright ©2016 All Rights Reserved xd.com 文网游备字[2011]W-RPG089号 就牛逼网络股份有限公司</tr> 376 <tr><a style="float:right; font-size:9px; color:#CCC;">联系方式：000-00000000 商务合作 Business Contact：cooperation@jiuniubi.com </tr> 377 </table> 378 </td> 379 <td width="200px"></td> 380 </tr> 381 </div>以上是关于人生中第一次做的网页，留个纪念的主要内容，如果未能解决你的问题，请参考以下文章