bootstrap自适应登录表单页面代码-html代码-BFW代码库

bootstrap自适应登录表单页面代码

代码语言：html

代码描述：bootstrap自适应登录表单页面代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.4.3.1.min.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
    <style>
        .demo {
	padding:20px 0;
	background:linear-gradient(to right,#7AB6B6 50%,#E5CFAA 50%);
}
.form-horizontal {
	background-color:#fff;
	font-family:'Arimo',sans-serif;
	text-align:center;
	padding:50px 30px 50px;
	box-shadow:12px 12px 0 0 rgba(0,0,0,0.3);
}
.form-horizontal .heading {
	color:#555;
	font-size:30px;
	font-weight:600;
	letter-spacing:1px;
	text-transform:capitalize;
	margin:0 0 50px 0;
}
.form-horizontal .form-group {
	margin:0 auto 30px;
	position:relative;
}
.form-horizontal .form-group:nth-last-child(2) {
	margin-bottom:20px;
}
.form-horizontal .form-group:last-child {
	margin:0;
}
.form-horizontal .form-group>i {
	color:#999;
	transform:translateY(-50%);
	position:absolute;
	left:5px;
	top:50%;
}
.form-horizontal .form-control {
	color:#7AB6B6;
	background-color:#fff;
	font-size:17px;
	letter-spacing:1px;
	height:40px;
	padding:5px 10px 2px 25px;
	box-shadow:0 0 0 0 transparent;
	border:none;
	border-bottom:1px solid rgba(0,0,0,0.1);
	border-radius:0;
	display:inline-block;
}
.form-control::placeholder {
	color:rgba(0,0,0,0.2);
	font-size:16px;
}
.form-horizontal .form-control:focus {
	border-bottom:1px solid #7AB6B6;
	box-shadow:none;
}
.form-horizontal .btn {
	color:#7AB6B6;
	background-color:#EDF6F5;
	font-size:18px;
	font-weight:700;
	letter-spacing:1px;
	border-radius:5px;
	width:50%;
	height:45px;
	padding:7px 30px;
	margin:0 auto 25px;
	border:none;
	display:block;
	position:relative;
	transition:all 0.3s ease;
}
.form-horizontal .btn:focus,.form-h.........完整代码请登录后点击上方下载按钮下载查看