第一个html--仿英雄联盟
浏览数：36 /
时间：2015年06月09日
?
页面效果：
?
源码：
<html>
<head>
<title>LOL--新手推荐英雄</title>
<style>
#continer{
border:1px #ff0000 solid;
width:1000px;
height:700px;
background:#ffffff;
}
#header{
/*border:1px #00ff00 solid;*/
width:100%;
height:145px;
background:#ffffff;
margin: 0px auto;
background:url(‘image/xinshou/xinshou-Logo.png‘) no-repeat;
}
#leftcontent{
/*border:1px #0000ff solid;*/
width:700px;
height:550px;
background:#ffffff;
float:left;
}
#rightcontent{
border:1px #f0f000 solid;
width:250px;
height:550px;
background:#ffffff;
float:left;
margin-left:20px;
}
#bodyer{
border:1px #f0f000 solid;
width:100%;
background:#ffffff;
}
#bottomer{
clear:both;
border:1px #00ff00 solid;
width:1000px;
height:20px;
background:#ffff00;
}
#jiansheng{
width:120px;
height:120px;
background:url(‘image/xinshou/11_Web_0.jpg‘) no-repeat;
}
#longgui{
width:120px;
height:120px;
background:url(‘image/xinshou/33_Web_0.jpg‘) no-repeat;
}
#niutou{
width:120px;
height:120px;
background:url(‘image/xinshou/Alistar_Square_0.png‘) no-repeat;
}
#amumu{
width:120px;
height:120px;
background:url(‘image/xinshou/Darius_Square_0.png‘) no-repeat;
}
#mori{
width:120px;
height:120px;
background:url(‘image/xinshou/Fiddlesticks_Square_0.png‘) no-repeat;
}
#nunu{
width:120px;
height:120px;
background:url(‘image/xinshou/Nunu_Square_0.png‘) no-repeat;
}
#qinnv{
width:120px;
height:120px;
background:url(‘image/xinshou/Sona_Square_0.png‘) no-repeat;
}
#xingma{
width:120px;
height:120px;
background:url(‘image/xinshou/Soraka_Square_0.png‘) no-repeat;
}
#baixiong{
width:120px;
height:120px;
background:url(‘image/xinshou/Volibear_Square_0.png‘) no-repeat;
}
#zhaoxin{
width:120px;
height:120px;
background:url(‘image/xinshou/XinZhao_Square_0.png‘) no-repeat;
}
#robot{
width:90px;
height:90px;
background:url(‘image/xinshou/53_Web_0.jpg‘) no-repeat;
}
#houzi{
width:90px;
height:90px;
background:url(‘image/xinshou/champions_62.jpg‘) no-repeat;
}
#kate{
width:90px;
height:90px;
background:url(‘image/xinshou/55_Web_0.jpg‘) no-repeat;
}
#wanglingyongshi{
width:90px;
height:90px;
background:url(‘image/xinshou/champions_14.jpg‘) no-repeat;
}
#ceshi{
width:90px;
height:90px;
cellspacing:0;
cellpadding:0;
border:1px #00ff00 solid;
}
.fontr{
font-size:20px;
font-weight:bold;
text-left:20px;
}
.fonter{
font-size:20px;
font-weight:bold;
text-align:center;
}
#select1{
/*border: 1px #00ff00 solid;*/
font-size:40px;
font-weight:bold;
color:#ff0000;
text-align:center;
}
#select2{
width:140px;
height:150px;
margin:10px auto;
background:url(‘image/xinshou/xinshou--tuijian.png‘) no-repeat;
}
#select3{
width:140px;
height:150px;
margin:10px auto;
background:url(‘image/xinshou/xinshou--tuijian2.png‘) no-repeat;
}
.tuijianFont{
font-size :20px;
text-align:center;
}
</style>
</head>
<body>
<div id="continer">
<div id="header"></div>
<div id="bodyer">
<div id="leftcontent">
<table table cellpadding=2 cellspacing=10 boder=1 >
<tr >
<td><a href="Hero--Blade Master.html"><div id="jiansheng" ></div></a></td>
<td><div id="longgui" ></div></td>
<td><div id="niutou"></div></td>
<td><div id="amumu"></div></td>
<td><div id="mori"></div></td>
</tr>
<tr>
<td class="fonter">无极剑圣</td>
<td class="fonter">披甲龙龟</td>
<td class="fonter">牛头酋长</td>
<td class="fonter">诺克萨斯之手</td>
<td class="fonter">末日使者</td>
</tr>
<tr>
<td><div id="nunu" ></div></td>
<td><div id="qinnv"></div></td>
<td><div id="xingma"></div></td>
<td><div id="baixiong"></div></td>
<td><div id="zhaoxin"></div></td>
</tr>
<tr>
<td class="fonter">雪人骑士</td>
<td class="fonter">琴瑟仙女</td>
<td class="fonter">众星之子</td>
<td class="fonter">雷霆咆哮</td>
<td class="fonter">赵信</td>
</tr>
<tr>
<td><div id="robot" ></div></td>
<td><div id="houzi"></div></td>
<td><div id="kate"></div></td>
<td><div id="wanglingyongshi"></div></td>
<td></td>
</tr>
<tr>
<td class="fontr">蒸汽机器人</td>
<td class="fontr">齐天大圣</td>
<td class="fontr">不祥之刃</td>
<td class="fontr">亡灵勇士</td>
<td></td>
</tr>
</table>
</div>
<div id="rightcontent">
<div id="select1">每日推荐</div>
<a href="http://lol.17173.com/"><div id="select2" ></div></a>
<div class="tuijianFont">
大区：黑色玫瑰<br/>
游戏昵称：傲娇软萌小妙菱
</div>
<a href="http://lol.17173.com/"><div id="select3" ></div></a>
<div class="tuijianFont">
大区：黑色玫瑰<br/>
游戏昵称：请叫我呆萌梦依
</div>
<div class="tuijianFont"><br/>关注更多请登录：http://lol.duowan.com/</div>
</div>
</div>
<div id="bottomer"></div>
</div>
</body>
</html>
?
?? 感想：
? 1，在做这个的时候，一边做这个，一边和java进行比较，发现确实有共同之处，对java理解深了那么一点点。
? 2，搞编程 就要坐的住，以前坐不住，现在一座就几个小时，
? 3，发现在 解决一个个出现的问题之后，会有一种莫名的兴奋感，那个叫高兴吧
? 4，要自己动手，丰衣足食,自己慢慢写代码，
?
?
?
?
?????????????????????????????????????????????????????????????????????????????????????????????????????????????????? ?2014.11.14
??????????????????????????????????????????????????????????????????????????????????????????????????????? ? 致那些还在搞编程的人
?
?
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
