东软学习，基于bootstrap的一个简单大屏轮播主页

于 2014-09-17 11:46:31 发布
阅读量617 收藏
点赞数
分类专栏： 东软学习笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010095995/article/details/39340515
版权 
<%@ page language="java" contentType="text/html; charset=UtF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Insert title here</title>
		<link rel="stylesheet" href="css/bootstrap.css">
		<script src="js/jquery-1.7.js"></script>
		<script src="js/bootstrap.js"></script>
		<style type="text/css">
h1 ,a{
	text-shadow: 5px 5px 8px #000000;
}

div #tran{
	transition: width 1s, height 1s, background 1s;
	-moz-transition: width 1s, height 1s, background 1s, -moz-transform 1s;
	/* Firefox 4 */
	-webkit-transition: width 2s, height 2s, -webkit-transform 2s;
	/* Safari and Chrome */
	-o-transition: width 2s, height 2s, -o-transform 2s; /* Opera */
}

div:hover #tran{
	transform: rotate(180deg);
	-moz-transform: rotateY(180deg); /* Firefox 4 */
	-webkit-transform: rotateY(180deg); /* Safari and Chrome */
	-o-transform: rotateY(180deg); /* Opera */
}
a
</style>
	</head>

	<body>

		<div  class="jumbotron">
			<div class="container ">
				<h1>
					欢迎您，管理员
				</h1>
				<p>
					您上次登录时间为2014年9月15日10:51:59
				</p>
				<p>
					<a class="btn btn-primary btn-lg"  href="#c4" role="button">立即开始</a>
				</p>
			</div>
		</div>
		<div class="row row-lg-12">
		
			<div class="col-sm-6 col-md-3 text-center">
				<div  class="thumbnail">
					<p>
						 
					</p>
					<img id = "tran"  src="css/1.png" alt="...">
					<div class="caption">
						<h3>
							部门管理
						</h3>
						<p>
							 
						</p>
						<p>
							<a href="#" class="btn btn-primary" role="button">添加部门</a>
							<a href="#" class="btn btn-info" role="button">部门管理</a>
						</p>
					</div>
				</div>
			</div>
			<div  class="col-sm-6 col-md-3 text-center">
				<div class="thumbnail">
					<p>
						 
					</p>
					<img id = "tran" src="css/2.png" alt="...">
					<div class="caption">
						<h3>
							岗位管理
						</h3>
						<p>
							 
						</p>
						<p>
							<a href="#" class="btn btn-primary" role="button">添加岗位</a>
							<a href="#" class="btn btn-info" role="button">岗位管理</a>
						</p>
					</div>
				</div>
			</div>
			<div  class="col-sm-6 col-md-3 text-center">
				<div class="thumbnail">
					<p>
						 
					</p>
					<img id = "tran" src="css/3.png" alt="...">
					<div class="caption">
						<h3>
							入职管理
						</h3>
						<p>
							 
						</p>
						<p>
							<a href="#" class="btn btn-primary" role="button">添加部门</a>
							<a href="#" class="btn btn-info" role="button">部门管理</a>
						</p>
					</div>
				</div>
			</div>
			<div  class="col-sm-6 col-md-3 text-center">
				<div class="thumbnail">
					<p>
						 
					</p>
					<img id = "tran" src="css/4.png" alt="...">
					<div class="caption">
						<h3>
							试用期管理
						</h3>
						<p>
							 
						</p>
						<p>
							<a href="#" class="btn btn-primary" role="button">添加部门</a>
							<a href="#" class="btn btn-info" role="button">部门管理</a>
						</p>
					</div>
				</div>
			</div>
		</div>
		<div class="row row-lg-12">
			<div  class="col-sm-6 col-md-3  text-center">
				<div class="thumbnail">
					<p>
						 
					</p>
					<img id = "tran" src="css/5.png" alt="...">
					<div class="caption">
						<h3>
							部门调动
						</h3>
						<p>
							 
						</p>
						<p>
							<a href="#" class="btn btn-primary" role="button">员工部门调动</a>
							<a href="#" class="btn btn-info" role="button">查询</a>
						</p>
					</div>
				</div>
			</div>
			<div class="col-sm-6 col-md-3  text-center">
				<div class="thumbnail">
					<p>
						 
					</p>
					<img id = "tran" src="css/6.png" alt="...">
					<div class="caption">
						<h3>
							岗位调动
						</h3>
						<p>
							 
						</p>
						<p>
							<a href="#" class="btn btn-primary" role="button">员工岗位调动</a>
							<a href="#" class="btn btn-info" role="button">查询</a>
						</p>
					</div>
				</div>
			</div>
			
			<div class="col-sm-6 col-md-3  text-center">
				<div class="thumbnail">
					<p>
						 
					</p>
					<img  id = "tran" src="css/7.png" alt="...">
					<div class="caption">
						<h3>
							离职管理
						</h3>
						<p>
							 
						</p>
						<p>
							<a href="#" class="btn btn-primary" role="button">员工离职管理</a>
							<a href="#" class="btn btn-info" role="button">查询</a>
						</p>
					</div>
				</div>
			</div>
			<div class="col-sm-6 col-md-3 text-center">
				<div class="thumbnail">
					<p>
						 
					</p>
					<img  id = "tran" src="css/8.png" alt="...">
					<div class="caption">
						<h3>
							信息管理
						</h3>
						<p>
							 
						</p>
						<p>
							<a href="#" class="btn btn-primary" role="button">员工信息中心</a>
							<a href="#" class="btn btn-info" role="button">查询</a>
						</p>
					</div>
				</div>
			</div>
		</div>
<a name = "c4"></a>
	</body>
</html>

不三郭四
关注
专栏目录
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值