SOURCE

<header> <img id="x1" src="http://tw.meetgee.com/Files/Topic/2013-11-15_1328191931.jpg"> 
<h4>英雄联盟</h4></header>
<nav><a href="#">首页</a> <a href="http://jsrun.net/rAkKp/show">背景介绍</a> <a href="http://jsrun.net/MAkKp/show">召唤师技能</a> <a href="http://jsrun.net/jAkKp/show">天赋符文</a></nav>
<div class="btn-group">
	<button type="button" class="btn btn-default"><a href="http://lol.qq.com/act/a20170429midrevel/index.htm?e_code=317620&atm_cl=ad&atm_pos=16601&idata_id=128647">终极永久皮肤免费领</a></button>
	<button type="button" class="btn btn-default"><a href="http://lol.qq.com/webplat/info/news_version3/152/22006/m14290/201705/581796.shtml?e_code=321150&atm_cl=ad&atm_pos=16602&idata_id=132798">季中版本更新揭秘</a></button>
	<button type="button" class="btn btn-default"><a href="http://lol.qq.com/act/a20170505vastaya/index.htm?ADTAG=media.free.guanwang.lunbo&e_code=321229&atm_cl=ad&atm_pos=16605&idata_id=132838">洛与霞有声故事</a></button>
</div>
<div id="x2"><p><b>《英雄联盟》</b><i>(简称LOL)是由美国拳头游戏(Riot Games)开发、中国大陆地区腾讯游戏代理运营的英雄对战MOBA竞技网游。</i></p>
<p>游戏里拥有数百个个性英雄，并拥有排位系统、天赋系统、符文系统等特色养成系统。</p>
<p><b>《英雄联盟》</b><i>还致力于推动全球电子竞技的发展，除了联动各赛区发展职业联赛、打造电竞体系之外，每年还会举办“季中冠军赛”“全球总决赛”“All Star全明星赛”三大世界级赛事，获得了亿万玩家的喜爱，形成了自己独有的电子竞技文化。</i></p>
        </div>
<div id="myCarousel" class="carousel slide">
	<!-- 轮播（Carousel）指标 -->
	<ol class="carousel-indicators">
		<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
		<li data-target="#myCarousel" data-slide-to="1"></li>
		<li data-target="#myCarousel" data-slide-to="2"></li>
	</ol>   
	<!-- 轮播（Carousel）项目 -->
	<div class="carousel-inner">
		<div class="item active">
			<img  style="width:100%;height:180px;" src=https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1494260673764&di=d2760d1e2013a3b836ee2fc655a88c5d&imgtype=0&src=http%3A%2F%2Fpic29.photophoto.cn%2F20131105%2F0005018369736682_b.jpg alt="First slide" class="tp1">
		</div>
		<div class="item"><img style="width:100%;height:180px;" src=https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1494260703219&di=5e11fdda4f77e1508917c7f4751a42b6&imgtype=0&src=http%3A%2F%2Fpic26.photophoto.cn%2F20130114%2F0005018348896326_b.jpg alt="Second slide" class="tp1">
			
		</div>
		<div class="item">
			<img style="width:100%;height:180px;" src=https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1494260750859&di=1562565728c4b88cdab71d8a8f8e3b81&imgtype=0&src=http%3A%2F%2Fpic33.photophoto.cn%2F20141117%2F0005018318992423_b.jpg  alt="Third slide" class="tp1">
		</div>
	</div>
	<!-- 轮播（Carousel）导航 -->
	<a class="carousel-control left" href="#myCarousel" 
	   data-slide="prev">&lsaquo;</a>
	<a class="carousel-control right" href="#myCarousel" 
	   data-slide="next">&rsaquo;</a>
</div>
<footer><p class="copyright">英雄一起去超越<a target="_blank" href="//www.baidu.com/duty/" class="agreement" style="margin-left:10px;">使用百度前必读</a><a target="_blank" href="http://lol.qq.com/v2/" style="margin-left:10px;">了解更多</a></p></footer>

body
{
  text-align:center;
   background-color:#00FFFF;
}
#x1
{
  width:100%;height:200px; 
}
#x2
{
  font-size:19px;
}
.copyright
{
   background-color:black;
}