_Walker
2016-01-29 22:23
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>现代浏览器博物馆</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style type="text/css">
body{
padding-top: 50px;
}
.carousel{
height: 350px;
background-color:#000;
}
.carousel .item{
height: 350px;
background-color:#000;
}
.carousel img{
width: 100%;
}
.carousel-caption{
margin-bottom: 20px;
font-size: 20px;
line-height: 1.8;
}
</style>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top navbar-inverse">
<div>
<!-- Brand and toggle get grouped for better mobile display -->
<div>
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span>Toggle navigation</span>
<span></span>
<span></span>
<span></span>
</button>
<a href="#">现代浏览器博物馆</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="#">综述</a></li>
<li><a href="#">简述</a></li>
<li>
<a href="#" data-toggle="dropdown">特点<span></span></a>
<ul role="menu">
<li><a href="#">Chrome</a></li>
<li><a href="#">Firefox</a></li>
<li><a href="#">Opera</a></li>
<li><a href="#">Safari</a></li>
<li><a href="#">IE</a></li>
</ul>
</li>
<li><a href="#">关于</a></li>
</li>
</ul>
</div>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol>
<li data-target="#carousel-example-generic" data-slide-to="0"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
<li data-target="#carousel-example-generic" data-slide-to="3"></li>
<li data-target="#carousel-example-generic" data-slide-to="4"></li>
</ol>
<!-- Wrapper for slides -->
<div role="listbox">
<div class="item active">
<img src="http://pic.baike.soso.com/p/20140620/20140620160951-121466348.jpg" alt="1 slide">
<div>
<h1>Chrome</h1>
<p>Google Chrome,又称Google浏览器,是一个由Google(谷歌)公司开发的网页浏览器。</p>
<p><a class="btn btn-lg btn-primary" href="http://www.google.cn/int1/zh-CN/chrome/browser/" role="button" target="_blank">点我下载</a></p>
</div>
</div>
<div>
<img src="http://tupian.enterdesk.com/2012/0624/1/15.jpg" alt="2 slide">
<div>
<p>Mozilla Firefox,中文名通常称为“火狐”或“火狐浏览器”,是一个开源网页浏览器。</p>
<p><a class="btn btn-lg btn-primary" href="http://www.firefox.com.cn/download/" role="button" target="_blank">点我下载</a></p>
</div>
</div>
<div>
<img src="http://www.uisheji.com/wp-content/uploads/2013/06/13/ios7-icon-safari-800x600.png" alt="3 slide">
<div>
<p>Safari,是苹果计算机的最新操作系统Mac OS X中的浏览器。</p>
<p><a class="btn btn-lg btn-primary" href="http://www.apple.com/cn/safari/" role="button" target="_blank">点我下载</a></p>
</div>
</div>
<div>
<img src="http://www.xiazaizhijia.com/uploads/allimg/140313/87-140313114442910.jpg" alt="4 slide">
<div>
<p>Opera浏览器,是一款挪威Opera Software ASA公司制作的支持多页面标签式浏览的网络浏览器。</p>
<p><a class="btn btn-lg btn-primary" href="http://www.opera.com/zh-cn" role="button" target="_blank">点我下载</a></p>
</div>
</div>
<div>
<img src="http://www.xuanxue.com/file/upload/201504/02/10-12-53-77-1.png" alt="5 slide">
<div>
<p>Internet Explorer,简称IE,是微软公司推出的一款网页浏览器。</p>
<p><a class="btn btn-lg btn-primary" href="http://ie.microsoft.com/" role="button" target="_blank">点我下载</a></p>
</div>
</div>
...
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span>Previous</span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span>Next</span>
</a>
</div>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
你把电脑砸了在买一个也行
你把电脑刷机就好了你卡了
基于bootstrap的网页开发
187669 学习 · 734 问题
相似问题