Hello Friends To we will learn how to create beautiful responsive login page using html and css.
- Bootstrap Login Page
- Responsive Login Page
- Download Login Page
Add These Files in Head Section
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
addEventListener("load", function () {
setTimeout(hideURLbar, 0);
}, false);
function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
<link href="css/font-awesome.min.css" rel="stylesheet">HTML
<!-- content -->
<div class="sub-main-schauhan">
<section class="login" >
<p class="legend"><img src="images/ZX.jpg" /></p>
<div class="input">
<input type="email" placeholder="Username" name="email" required />
<span class="fa fa-envelope"></span>
</div>
<div class="input">
<input type="password" placeholder="Password" name="password" required />
<span class="fa fa-unlock"></span>
</div>
<input type="button" class="submit" value="LOGIN" />
</section>
</div>
<!-- //content -->
<!-- copyright -->
<div class="footer">
<h2>© 2019 schauhan.in All Right Reserved | Design by
<a href="http://www.schauhan.in">SCHAUHAN</a>
</h2>
</div>
<!-- //copyright -->
CSS
Add This Css Link in Your Header Section or Open this https://secureservercdn.net/160.153.137.184/ch7.c24.myftpupload.com/Examples/Login_1/css/style.css link in browser and save the css File and Link it in your head section.
<link href="https://secureservercdn.net/160.153.137.184/ch7.c24.myftpupload.com/Examples/Login_1/css/style.css" rel="stylesheet" type="text/css">
