wubb 8 vuotta sitten
vanhempi
commit
37f709e521

+ 41 - 0
html/css/old_style.css

@@ -0,0 +1,41 @@
+input{outline:none} 
+li{list-style-type: none;}
+a:hover{text-decoration:none}
+.container {
+    width: 1270px;
+}
+header{height: 35px; line-height: 35px; background-color: #F3F3F3;border-bottom:1px solid #eeeeee;font-size: 12px;}
+.lt{float: left;}
+.rt{float: right;}
+.rt a{padding: 0 5px; }
+.rt div{float: right;}
+.login{border-right: 2px solid #CFCFCF;}
+
+.dropdown-toggle{display: block;}
+.dropdown-menu{top: 90%;width: 500px;right: 0;left: -410px;}
+.glyphicon-play{transform: rotate(90deg);}
+.header_nav{height: 90px;}
+.logo{height: 90px; line-height: 90px;}
+.nav_content{height: 90px; line-height: 90px;}
+.nav-pills>li>a{color: #000;}
+.nav-pills>li.active>a,.nav-pills>li>a:hover,.nav-pills>li.active>a:hover{color: #58a3ff;background-color:#fff}
+.nav>li>a{padding: 0 30px;}
+.search{position: relative; padding-left: 0;}
+.search input{width: 100%; height: 36px; line-height: 36px;margin-top: 28px; border: 1px solid #c9c9c9; border-radius: 20px;padding: 0 40px 0 10px;}
+.search span{position: absolute; right: 15px; top: 28px; width: 40px; height: 36px; line-height: 34px;cursor:pointer}
+
+#myCarousel .carousel-indicators{ top: 65%;}
+#myCarousel .carousel-indicators li{width: 30px; height: 1px; margin:0;border: 1px solid #091623; margin-left: 5px;}
+#myCarousel .carousel-indicators .active{width: 30px; height: 1px; margin: 0; border: 1px solid #fff;}
+
+.content_lf{width: 366px;height: 462px; margin-right: 1px;}
+.service{height: 290px;}
+.star{height: 170px;}
+.content_mid{width: 365px;height: 462px; margin-right: 1px;}
+.content_mid img{width: 100%;height: 462px!important;}
+.content_rt{width: 507px;height: 462px;background: #eee;}
+
+footer{height: 122px;background: #3c3d43;line-height: 122px;text-align: center;}
+footer a{padding: 0 8px;border-right: 1px solid #828389; color: #828389;}
+footer a:last-child{border: none;}
+footer a:hover{color: #58a3ff;}

+ 65 - 0
html/css/style.css

@@ -0,0 +1,65 @@
+body{color: #333333;font-family: "微软雅黑";}
+input{outline:none} 
+li{list-style-type: none;}
+ul,li{margin: 0;padding: 0;}
+i{font-style:normal}
+a{color: #a3a3a3}
+a:hover{text-decoration:none;color: #9bc8ff;}
+
+.container {
+    width: 1000px;
+}
+header{height: 35px; line-height: 35px; background-color: #F3F3F3;border-bottom:1px solid #eeeeee;font-size: 12px;color: #999999;}
+.lt{float: left;}
+.rt{float: right;}
+.rt a{padding: 0 5px; }
+.rt div{float: right;}
+.login{border-right: 2px solid #CFCFCF;}
+
+.hot{margin-top: 20px; line-height: 14px;}
+.hot span{float: left;margin-right: 35px;font-size: 16px;color: #58a3ff;}
+.hot ul{float: left;}
+.hot li{margin-right: 30px; float: left;/*list-style-type:square;*/ line-height: 16px;}
+.hot li:last-child{margin-right:0 ;}
+
+.logo{height: 260px; line-height: 330px; text-align: center;}
+.search input{border-color: #58a3ff;border-radius: 0;}
+.search button{padding: 6px 30px;border-radius: 0;background: #58a3ff;color: #fff;border-color: #58a3ff;}
+.search button:hover{background: #58a3ff;color: #fff;border-color: #58a3ff;}
+.header_nav{margin-bottom: 20px;}
+
+.content_lt{width: 670px;margin-right: 20px;float: left;}
+.content_nav{border-bottom: 1px solid #ececec;background: #fafafa; overflow: auto;}
+.content_nav ul li{float: left;}
+.content_nav ul li.active a{line-height: 36px!important;}
+.content_nav a{width: 80px;height: 40px;line-height: 44px;display: inline-block;text-align: center; color: #333333;}
+.content_nav a:hover{/*line-height: 36px;background: #fff; border:1px solid #ececec; border-top:4px solid #58a3ff; border-bottom: none; color: #58a3ff!important;*/}
+.active{background: #fff; border:1px solid #ececec; border-top:4px solid #58a3ff; border-bottom: none; color: #58a3ff}
+
+.content_list{width: 670px; float: left;margin-top: 20px;}
+.content_list>div{border-top: none;}
+.info_img{float: left; width: 120px; height:96px;margin:0 20px;}
+.info_img img{width: 100%;height: 100%;}
+.content_info{float: left; padding: 20px 0; width: 100%; border-bottom: 1px solid #ececec;}
+.content_info:hover{background: #fafafa;}
+.info_act{background: #fafafa;}
+
+.info_txt{ width: 500px; float: left;font-size: 16px; line-height: 28px;color: #333333;}
+.info_txt>p{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;height: 56px;}
+
+.source{font-size: 14px;}
+.source span{margin-right: 25px;}
+.source i{padding: 6px 9px;margin-right: 12px;background: #f5f5f5; color: #999999;}
+.source .name{color: #4466bf;background: #f0f7ff;}
+
+.zc_info_txt{padding: 0 20px;font-size: 16px; color: #333333;}
+.zc_info_txt .source span{margin-right: 15px;color: #999999;}
+
+.content_rt{width: 310px;float: left;border: 1px solid #ececec;}
+
+.content_rt div{padding: 10px; border-bottom: 1px dashed #d9d9d9; overflow: auto;}
+.content_rt div:last-child{border: none;}
+.content_rt ul li{float: left;}
+.content_rt ul li a{padding: 3px 10px; border: 1px solid #c9c9c9; display: block; border-radius: 30px; font-size: 12px; margin: 0 10px 10px 0;}
+.content_rt ul li a:hover{color: #fff;background: #58a3ff;border-color: #58a3ff;}
+.content_rt h4{margin-bottom: 14px;}

BIN
html/img/img1.jpg


BIN
html/img/logo.png


BIN
html/img/mx_img_1.png


BIN
html/img/mx_img_2.png


BIN
html/img/mx_img_3.png


BIN
html/img/mx_img_4.png


BIN
html/img/search_ioc.png


BIN
html/img/slide_img_1.png


BIN
html/img/slide_img_s_1.png


BIN
html/img/zc_img_1.png


+ 344 - 0
html/index.html

@@ -0,0 +1,344 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8" />
+		<title></title>
+		<!-- 新 Bootstrap 核心 CSS 文件 -->
+		<link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
+		<link href="css/style.css" rel="stylesheet"/>
+		<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
+		<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
+		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
+		<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+		<script type="text/javascript" src="js/public.js" ></script>
+	</head>
+	<body>
+		<header>
+			<div class="container">
+				<div class="lt">欢迎进入科技认知计算交易平台!</div>
+				<div class="rt">
+					<a href="#" class="login">登录</a>
+					<a href="#">注册</a>
+				</div>
+			</div>
+		</header>
+		<div class="container header_nav">
+			<div class="row clearfix">
+				<div class="col-md-12 logo">
+					<img src="img/logo.png" />
+				</div>
+				
+			</div>
+			<div class="search">
+				<div class="row clearfix">
+					<div class="col-lg-8 col-md-offset-2">
+		                <div class="input-group ">
+		                    <input type="text" class="form-control">
+		                    <span class="input-group-btn">
+		                        <button class="btn btn-default" type="button">搜索</button>
+		                    </span>
+		                </div><!-- /input-group -->
+		            </div>
+		            <div class="col-lg-8 col-md-offset-2">
+		            	<div class="hot">
+		            		<ul>
+			                	<li><a href="#">科技交易</a></li>
+			                	<li><a href="#">网上创客</a></li>
+			                	<li><a href="#">趣科普</a></li>
+			                	<li><a href="#">科技金融</a></li>
+			                </ul>
+		            	</div>
+		                
+		            </div>
+		       </div>
+			</div>
+		</div>
+		<div class="container content">
+			<div class="row clearfix">
+				<div class="content_lt">
+					<div class="content_nav">
+						<ul id="myTab">
+							<li><a href="#tab1" data-toggle="tab">关注</a></li>
+							<li class="active"><a href="#tab2" data-toggle="tab">政策</a></li>
+							<li><a href="#tab3" data-toggle="tab">前沿</a></li>
+							<li><a href="#tab4" data-toggle="tab">明星</a></li>
+							<li><a href="#tab5" data-toggle="tab">活动</a></li>
+							<li><a href="#tab6" data-toggle="tab">VR</a></li>
+						</ul>
+
+					</div>
+					
+					<div id="myTabContent" class="content_list tab-content">
+						<div id="tab1" class="tab-pane">
+
+						</div>
+						<div id="tab2" class="tab-pane in active">
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>科技成果转化频发政策“红包”,甜头怎么尝</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>11:16</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>成果转化是从一种创新走向另一种创新</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>12:11</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>从“科技的春天”到“创新的春天”</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>13:26</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>专利战略在企业创新全过程中的应用</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>15:23</span>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div id="tab3" class="tab-pane">
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>NASA新一代太空望远镜 届时将看到宇宙第一光芒</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>07:56</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>满满的黑科技 推不倒的自行车</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>08:06</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>最新3D全息投影技术 为可口可乐麦当劳服务</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>09:33</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>德国科学家发明新型化合物 属无机纳米晶体结构</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>12:36</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>中国首条空中自行车道试营 体验云端行走</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>17:25</span>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div id="tab4" class="tab-pane">
+							<div class="content_info ">
+								<div class="info_img">
+									<img src="img/mx_img_1.png" />
+								</div>
+								<div class="info_txt">
+									<p>美国工程院院士,资深核能咨询顾问,美国能源部高级 顾问,美国国家研究委员会董事会能源与环境系统主席。</p>
+									<div class="source">
+										<span>中国网</span>
+										<i class="name">钱平 | Douglas M. Chapin</i>
+										<i>美国</i>
+										<i>能源与环境</i>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="info_img">
+									<img src="img/mx_img_2.png" />
+								</div>
+								<div class="info_txt">
+									<p>加拿大工程院院士,加拿大皇家学院院士,荣获英国国际名人传记中心颁发的的“信号处理研究及教育杰出贡献奖”。</p>
+									<div class="source">
+										<span>中国网</span>
+										<i class="name">黄干| Kon Max Wong</i>
+										<i>加拿大</i>
+										<i>信号处理</i>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="info_img">
+									<img src="img/mx_img_3.png" />
+								</div>
+								<div class="info_txt">
+									<p>英国皇家工程院院士,英国纽卡斯尔大学水利工程系教授,1995年获得欧洲地球物理学会金徽章奖。</p>
+									<div class="source">
+										<span>中国网</span>
+										<i class="name">康英达|Enda O'Connell</i>
+										<i>英  国</i>
+										<i>水利工程</i>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="info_img">
+									<img src="img/mx_img_4.png" />
+								</div>
+								<div class="info_txt">
+									<p>(杂交水稻之父、首届国家最高科学奖获得者
+										袁隆平是杂交水稻研究领域的开创者和带头人,致力于杂交水稻的研究,先后成功研发出“三系法”杂交 水稻、“两系法”杂交水稻、超级杂交稻一期、二期,与此同时,袁隆平提出并实施“种三产四丰产工程”,运用超级杂交稻的技术成果,[3]  出版中、英文专著6部,发表论文60余篇。
+										</p>
+									<div class="source">
+										<span>中国网</span>
+										<i class="name">袁隆平</i>
+										<i>中国</i>
+										<i>农业</i>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div id="tab5" class="tab-pane">
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>港洽周科技交流对接会</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>09:16</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>中以美高端医疗产业高峰论坛会</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>11:15</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>2017年科技展览会</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>13:13</span>
+									</div>
+								</div>
+							</div>
+							<div class="content_info ">
+								<div class="zc_info_txt">
+									<p>2017中国科技展-北京科博会</p>
+									<div class="source">
+										<span>凤凰财经</span>
+										<span>04-01</span>
+										<span>16:23</span>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div id="tab6" class="tab-pane">
+
+						</div>
+					</div>
+				</div>
+				<div class="content_rt">
+					<div>
+						<h4>科技交易</h4>
+						<ul>
+							<li><a href="#">成果</a></li>
+							<li><a href="#">专家</a></li>
+							<li><a href="#">技术集群</a></li>
+							<li><a href="#">经纪人</a></li>
+							<li><a href="#">创业项目</a></li>
+							<li><a href="#">职业科技人</a></li>
+						</ul>
+					</div>
+					<div>
+						<h4>科技咨询</h4>
+						<ul>
+							<li><a href="#">高企认定</a></li>
+							<li><a href="#">专利申请</a></li>
+							<li><a href="#">知识产权贯标</a></li>
+							<li><a href="#">ISO9001</a></li>
+							<li><a href="#">创新体系</a></li>
+						</ul>
+					</div>
+					<div>
+						<h4>科技思想</h4>
+						<ul>
+							<li><a href="#">科技明星</a></li>
+							<li><a href="#">前沿科技思想</a></li>
+						</ul>
+					</div>
+					<div>
+						<h4>科技金融</h4>
+						<ul>
+							<li><a href="#">投资机构</a></li>
+							<li><a href="#">金融项目</a></li>
+							<li><a href="#">网上创客</a></li>
+						</ul>
+					</div>
+					<div>
+						<h4>应用工具</h4>
+						<ul>
+							<li><a href="#">技术评估</a></li>
+							<li><a href="#">技术查新</a></li>
+							<li><a href="#">空间主页</a></li>
+							<li><a href="#">会员体系</a></li>
+						</ul>
+					</div>
+					<div>
+						<h4>社群百科</h4>
+						<ul>
+							<li><a href="#">科技活动</a></li>
+							<li><a href="#">技术社群</a></li>
+							<li><a href="#">科技百科</a></li>
+							<li><a href="#">趣科普</a></li>
+						</ul>
+					</div>
+					<div>
+						<h4>合作伙伴</h4>
+						<ul>
+							<li><a href="#">政府合作</a></li>
+							<li><a href="#">高校合作</a></li>
+							<li><a href="#">科研单位</a></li>
+							<li><a href="#">民间达人</a></li>
+						</ul>
+					</div>
+				</div>
+			</div>
+		</div>
+	</body>
+</html>

+ 9 - 0
html/js/old_public.js

@@ -0,0 +1,9 @@
+$(function(){
+	$('div.dropdown').mouseover(function() {
+	  	$(this).addClass('open');    
+	}).mouseout(function() {        
+		$(this).removeClass('open');    
+	});
+	$("#myCarousel").carousel('cycle');
+	$("#myCarousel1").carousel('cycle');
+})

+ 9 - 0
html/js/public.js

@@ -0,0 +1,9 @@
+$(function(){
+//	$('div.dropdown').mouseover(function() {
+//	  	$(this).addClass('open');    
+//	}).mouseout(function() {        
+//		$(this).removeClass('open');    
+//	});
+//	$("#myCarousel").carousel('cycle');
+//	$("#myCarousel1").carousel('cycle');
+})

+ 155 - 0
html/old_index.html

@@ -0,0 +1,155 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8" />
+		<title></title>
+		<!-- 新 Bootstrap 核心 CSS 文件 -->
+		<link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
+		<link href="css/style.css" rel="stylesheet"/>
+		<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
+		<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
+		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
+		<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+		<script type="text/javascript" src="js/public.js" ></script>
+	</head>
+	<body>
+		<header>
+			<div class="container">
+				<div class="lt">欢迎进入科技认知计算交易平台!</div>
+				<div class="rt">
+					<a href="#" class="login">登录</a>
+					<a href="#">注册</a>
+					<div class="dropdown">
+						<a href="#" class="dropdown-toggle" data-toggle="dropdown">
+							<span class="glyphicon glyphicon-align-justify"></span>网站导航
+							<span class="glyphicon glyphicon-play"></span>
+						</a>
+						<div class="dropdown-menu">
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+							<a href="#">jmeter</a>
+						</div>
+					</div>
+				</div>
+			</div>
+		</header>
+		<div class="container header_nav">
+			<div class="row clearfix">
+				<div class="col-md-3 logo">
+					<img src="img/logo.png" />
+				</div>
+				<div class="col-md-7 nav_content">
+					<ul class="nav nav-pills">
+						<li class="active"><a href="#">科技认定</a></li>
+						<li><a href="#">成果转化</a></li>
+						<li><a href="#">科技明星</a></li>
+						<li><a href="#">知识产权</a></li>
+						<li><a href="#">评估</a></li>
+						<li><a href="#">更多</a></li>
+					</ul>
+				</div>
+				<div class="col-md-2 search">
+					<input type="text" class="" />
+					<span>
+						<img src="img/search_ioc.png" />
+					</span>
+				</div>
+			</div>
+		</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 src="img/slide_img_1.png" alt="First slide">
+				</div>
+				<div class="item">
+					<img src="img/slide_img_1.png" alt="Second slide">
+				</div>
+				<div class="item">
+					<img src="img/slide_img_1.png" alt="Third slide">
+				</div>
+			</div>
+			<!-- 轮播(Carousel)导航 -->
+			<a class="carousel-control left" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
+			<a class="carousel-control right" href="#myCarousel" 
+			   data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
+		</div> 
+
+		
+		<div class="container">
+			<div class="row clearfix">
+				<div class="col-md-12 column">
+					<div class="content_lf lt">
+						<div class="service">
+							<h3>常用业务</h3>
+							<ul>
+								<li><a href="#">常用业务相关网址链接</a></li>
+								<li><a href="#">常用业务相关网址链接</a></li>
+								<li><a href="#">常用业务相关网址链接</a></li>
+								<li><a href="#">常用业务相关网址链接</a></li>
+								<li><a href="#">常用业务相关网址链接</a></li>
+								<li><a href="#">常用业务相关网址链接</a></li>
+								<li><a href="#">常用业务相关网址链接</a></li>
+							</ul>
+						</div>
+						<div class="star">
+							
+						</div>
+					</div>
+					<div class="content_mid lt">
+						<div id="myCarousel1" class="carousel slide">
+							<ol class="carousel-indicators">
+								<li data-target="#myCarousel1" data-slide-to="0" class="active"></li>
+								<li data-target="#myCarousel1" data-slide-to="1"></li>
+								<li data-target="#myCarousel1" data-slide-to="2"></li>
+							</ol>   
+							<div class="carousel-inner">
+								<div class="item active">
+									<img src="img/slide_img_s_1.png" alt="First slide">
+								</div>
+								<div class="item">
+									<img src="img/slide_img_s_1.png" alt="Second slide">
+								</div>
+								<div class="item">
+									<img src="img/slide_img_s_1.png" alt="Third slide">
+								</div>
+							</div>
+						</div> 
+					</div>
+					<div class="content_rt lt">
+						
+					</div>
+				</div>
+			</div>
+		</div>
+		<footer>
+			<div class="container">
+				<a href="#">联系我们</a>
+				<a href="#">联系我们</a>
+				<a href="#">联系我们</a>
+				<a href="#">联系我们</a>
+				<a href="#">联系我们</a>
+				<a href="#">联系我们</a>
+			</div>
+		</footer>
+	</body>
+</html>

+ 64 - 0
html/test.html

@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title></title>
+		<!-- 新 Bootstrap 核心 CSS 文件 -->
+		<link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
+		<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
+		<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
+		 
+		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
+		<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+	</head>
+	<body>
+ <div class="onepage">
+              <div class="container" id="myCarousel">
+        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
+            <!-- Indicators -->
+            <ol class="carousel-indicators">
+                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
+                <li data-target="#carousel-example-generic" data-slide-to="1"></li>
+                <li data-target="#carousel-example-generic" data-slide-to="2"></li>
+            </ol>
+
+
+            <!-- Wrapper for slides -->
+            <div class="carousel-inner" role="listbox">
+                <div class="item active img"  >
+                    <img src="img/4.jpg"   >
+                    <div class="carousel-caption">
+                       the first
+                    </div>
+                </div>
+                <div class="item img">
+                    <img src="img/2.jpg">
+                    <div class="carousel-caption">
+                       syhdfh
+                    </div>
+                </div>
+                <div class="item img">
+                    <img src="img/3.jpg" >
+                    <div class="carousel-caption">
+                        syhdfh
+                    </div>
+                </div>
+
+
+            </div>
+
+
+            <!-- Controls -->
+            <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
+                <span class="glyphicon glyphicon-chevron-left"></span>
+                <span class="sr-only">Previous</span>
+            </a>
+            <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
+                <span class="glyphicon glyphicon-chevron-right"></span>
+                <span class="sr-only">Next</span>
+            </a>
+        </div>
+        </div>
+</div>
+	</body>
+</html>