<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>轮播图注册页面1</title>
<link rel="stylesheet" href="css/bootstrap.css" />
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.0.0/css/font-awesome.css" rel="stylesheet">
<script src="js/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<style type="text/css">
body{
/*给背景放一张照片*/
background-image: url(img/1.jpg);
/*给动画起名字*/
animation-name: myfirst;
/*动画时间*/
animation-duration: 12s;
animation-delay: 2s;
/*下一周期循环播放*/
animation-iteration-count:infinite ;
/*动画开始运行*/
animation-play-state: running;
}
@keyframes myfirst{
0%{
background: url(img/1.jpg) no-repeat 40% 50%;
}
34%{
background: url(img/2.jpg) no-repeat 40% 50%;
}
67%{
background: url(img/3.jpg) no-repeat 40% 50%;
}
100%{
background: url(img/5.jpg) no-repeat 40% 50%;
}
}
</style>
<div class="container">
<div class="row">
<form class="form-horizontal col-md-offset-3 col-md-4">
<h3 class="form-title" align="center">登录</h3>
<div class="form-group has-feedback">
<!--form-control-feedback 使图标放入input中-->
<i class="fa fa-user fa-2x form-control-feedback"></i>
<input type="text" class="form-control" id="username" name="username"autofocus="autofocus" maxlength="20"placeholder="请输入账号"/>
</div>
<div class="form-group has-feedback">
<i class="fa fa-lock fa-2x form-control-feedback"></i>
<input type="password" class="form-control" id="password" name="password"autofocus="autofocus" maxlength="8"placeholder="请输入密码"/>
</div>
<div class="form-group col-md-offset-3 col-md-4">
<label class="checkbox">
<input type="checkbox" value="1" name="remember"/>记住我
</label>
</div>
<br /><br />
<div class="form-group">
<input type="button" value="登录" class="btn btn-info"style=" 390px;"/>
</div>
</form>
</div>
</div>
</body>
</html>