用bootstrap实现的,三种风格的登录界面网页源码

大家好,今天给大家介绍一款,用bootstrap实现的,三种风格的登录界面网页源码(图1)。送给大家哦,获取方式在本文末尾。

用bootstrap实现的,三种风格的登录界面网页源码_第1张图片

图1

包含三种样式(图2)

用bootstrap实现的,三种风格的登录界面网页源码_第2张图片

图2

用bootstrap实现的,三种风格的登录界面网页源码_第3张图片

图2

部分源码:(下载请看文末)


html>



 <html class="no-js"> 
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Minimal and Clean Sign up / Login and Forgot Form by FreeHTML5.cotitle>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="Free HTML5 Template by FreeHTML5.co" />
	<meta name="keywords" content="free html5, free template, free bootstrap, html5, css3, mobile first, responsive" />
	

  

  	
	<meta property="og:title" content=""/>
	<meta property="og:image" content=""/>
	<meta property="og:url" content=""/>
	<meta property="og:site_name" content=""/>
	<meta property="og:description" content=""/>
	<meta name="twitter:title" content="" />
	<meta name="twitter:image" content="" />
	<meta name="twitter:url" content="" />
	<meta name="twitter:card" content="" />

	
	<link rel="shortcut icon" href="favicon.ico">

	<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700,300' rel='stylesheet' type='text/css'>
	
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/animate.css">
	<link rel="stylesheet" href="css/style.css">


	
	<script src="js/modernizr-2.6.2.min.js">script>
	
	

	head>
	<body>

		<div class="container">
			<div class="row">
				<div class="col-md-12 text-center">
					<ul class="menu">
						<li class="active"><a href="index.html">Style 1a>li>
						<li><a href="index2.html">Style 2a>li>
						<li><a href="index3.html">Style 3a>li>
					ul>
				div>
			div>
            <div class="copyrights">Collect from <a href="#"  title="网站模板">网站模板a>div>
			<div class="row">
				<div class="col-md-4 col-md-offset-4">
					

					
					<form action="#" class="fh5co-form animate-box" data-animate-effect="fadeIn">
						<h2>Sign Inh2>
						<div class="form-group">
							<label for="username" class="sr-only">Usernamelabel>
							<input type="text" class="form-control" id="username" placeholder="Username" autocomplete="off">
						div>
						<div class="form-group">
							<label for="password" class="sr-only">Passwordlabel>
							<input type="password" class="form-control" id="password" placeholder="Password" autocomplete="off">
						div>
						<div class="form-group">
							<label for="remember"><input type="checkbox" id="remember"> Remember Melabel>
						div>
						<div class="form-group">
							<p>Not registered? <a href="sign-up.html">Sign Upa> | <a href="forgot.html">Forgot Password?a>p>
						div>
						<div class="form-group">
							<input type="submit" value="Sign In" class="btn btn-primary">
						div>
					form>
					

				div>
			div>
			<div class="row" style="padding-top: 60px; clear: both;">
				<div class="col-md-12 text-center"><p><small>© All Rights Reserved. More Templates <a href="#" target="_blank" title="">a> <a href="#" target="_blank">a> - Collect from <a href="#" title="" target="_blank">a> <a href="#" target="_blank">a>small>p>div>
			div>
		div>
	
	
	<script src="js/jquery.min.js">script>
	
	<script src="js/bootstrap.min.js">script>
	
	<script src="js/jquery.placeholder.min.js">script>
	
	<script src="js/jquery.waypoints.min.js">script>
	
	<script src="js/main.js">script>


	body>
html>

本模板编码:10131,需要的朋友,关注下面公众号后,搜索10131,即可获取。

你可能感兴趣的:(前端源码,javascript,经验分享)