导航栏示例 | 页脚示例
<html>
<head>
<!-- 可直接使用框架提供的在线CSS文件 -->
<!-- 若要使用本地的文件,请注释掉下面两行标记 -->
<link rel="stylesheet" href="http://newfront.free4inno.com/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="http://newfront.free4inno.com/css/front.css">

<!-- 也可以使用下载到本地的CSS文件,请去掉下面两行标记的注释。其中localpath为本地路径。 -->
<!-- 若要使用在线文件,请注释掉下面两行标记 -->
<!-- <link rel="stylesheet" href="[localpath]/css/bootstrap.min.css"> -->
<!-- <link rel="stylesheet" href="[localpath]/css/front.css"> -->

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>登录首页</title>
</head>
<body>
<nav class="navbar navbar-default navbar-login front-nav">
    <div class="container">
    
        <div>
            <div class="nav-brand"><a href="#" class="nav-brand-text">REPACK</a></div>
        </div>
			<div class="collapse navbar-collapse"
				 style="padding-right: 0">
				<ul class="nav navbar-nav navbar-right" style="margin-right: 4%">
					<li><a href="#" class="free_reg"
						style="text-decoration: underline">免费注册</a></li>
					<li><a href="#"
						style="text-decoration: underline; padding-right: 0">登录</a></li>
				</ul>
			</div>
		</div>
	</nav>
	<div class="hero jumbotron ">
		<div class="container">
			<div class="row">
				<div style="margin-left: 4%">
					<h1 class="animated fadeInUp" style="color: white">
						面向群组的
						<div>在线知识管理应用</div>
					</h1>
				</div>
			</div>
			<div class="row top_margin30 ">
				<div style="margin-left: 4%">
					<a class="btn btn-info btn-lg login-page-btn free_reg  animated ">免费注册</a> 
					<a class="btn btn-info btn-lg login-page-btn animated  "
						href="#">立即登录</a>
				</div>
			</div>
		</div>
	</div>

	<div class="container" style="margin-top: -40px">
		<div class="row text-center" style="margin-bottom: 40px">
			<img src="/bootstrap/dev/img/free_provider.png" alt="">
		</div>
		<div class="row">
			<div class="col-md-3 text-center">
				<div class="feature  ">
					<div >
						<img src="/bootstrap-front/dev/img/share_1.png" width="50%" alt="">
					</div>
					<h4>丰富的分享类型</h4>
					<div>
						<p>文档、话题、视频,应有尽有</p>
					</div>
				</div>
			</div>
			<div class="col-md-3 text-center">
				<div class="feature">
					<div >
						<img src="/bootstrap-front/dev/img/share_2.png" width="50%" alt="">
					</div>
					<h4>强大的全局搜索</h4>
					<div>
						<p>找到需要的资源很容易</p>
					</div>
				</div>
			</div>
			<div class="col-md-3 text-center">
				<div class="feature">
					<div >
						<img src="/bootstrap-front/dev/img/share_3.png" width="50%" alt="">
					</div>
					<h4>创新的资源列表</h4>
					<div>
						<p>将资源高效有序的组织在一起</p>
					</div>
				</div>
			</div>
			<div class="col-md-3 text-center">
				<div class="feature">
					<div >
						<img src="/bootstrap-front/dev/img/share_4.png" width="50%" alt="">
					</div>
					<h4>完备的群组权限</h4>
					<div>
						<p>让知识在群组内可控流转</p>
					</div>
				</div>
			</div>
			<div class="col-md-3 text-center">
				<div >
					<img src="/bootstrap-front/dev/img/share_5.png" width="50%" alt="">
				</div>
				<h4>全面的群组管理</h4>
				<div>
					<p>让群组那些事儿井井有条</p>
				</div>
			</div>
			<div class="col-md-3 text-center">
				<div >
					<img src="/bootstrap-front/dev/img/share_6.png" width="50%" alt="">
				</div>
				<h4>整合的通信方式</h4>
				<div>
					<p>用邮件、QQ、微博@便捷交流</p>
				</div>
			</div>
			<div class="col-md-3 text-center">
				<div >
					<img src="/bootstrap-front/dev/img/share_7.png" width="50%" alt="">
				</div>
				<h4>集成的网页消息</h4>
				<div>
					<p>用多媒体通信实时互动</p>
				</div>
			</div>
			<div class="col-md-3 text-center">
				<div >
					<img src="/bootstrap-front/dev/img/share_8.png" width="50%" alt="">
				</div>
				<h4>多样的开放接口</h4>
				<div>
					<p>用分享我的能力让你强大</p>
				</div>
			</div>
		</div>
	</div>

<footer class="footer text-center">
		<p>
			<img src="/bootstrap/dev/img/share_logo.png" alt="">
		</p>
		<p class="footer-copyright">
			Copyright © 1996-2015 自邮之翼, All Rights Reserved
		</p>
	</footer>
<!-- 可直接使用框架提供的在线js文件 -->
<!-- 若要使用本地的文件,请注释掉下面三行标记 -->
<script src="http://newfront.free4inno.com/js/jquery/jquery.min.js"></script>
<script src="http://newfront.free4inno.com/bootstrap/js/bootstrap.min.js"></script>
<script src="http://newfront.free4inno.com/js/plugin/front.js"></script>

<!-- 也可以使用下载到本地的js文件,请去掉下面三行标记的注释。其中localpath为用户本地路径。 -->
<!-- 若要使用在线文件,请注释掉下面三行标记 -->
<!-- <script src="[localpath]/js/jquery.min.js"></script> -->
<!-- <script src="[localpath]/js/bootstrap.min.js"></script> -->
<!-- <script src="[localpath]/js/front.js"></script> -->
</body>
</html>