"login with fullscreen background - Sample "
Bootstrap 3.3.0 Snippet by Rehabmusa

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <body class="login2background"> <div class="container"> <div class="col-lg-6 col-md-6 col-sm-8 loginbox"> <div class=" row"> <div class="col-lg-8 col-md-8 col-sm-8 col-xs-6"> <img src="https://s4.postimg.org/64q1bgunx/logo_3.png" alt="Logo" class="logo"> </div> <div class="col-lg-4 col-md-4 col-sm-4 col-xs-6 "> <span class="singtext" >Sign in </span> </div> </div> <div class=" row loginbox_content "> <div class="input-group input-group-sm" > <span class="input-group-addon"> <span class="glyphicon glyphicon-user"></span> </span> <input class="form-control" type="text" placeholder="User name" > </div> <br> <div class="input-group input-group-sm"> <span class="input-group-addon"> <span class="glyphicon glyphicon-lock"></span> </span> <input class="form-control" type="password" placeholder="Password" > </div> </div> <div class="row "> <div class="col-lg-8 col-md-8 col-sm-8 col-xs-7 forgotpassword "> <a href="#" > Forgot Username / Password?</a> </div> <div class="col-lg-4 col-md-4 col-sm-4 col-xs-5 "> <a href="#" class=" btn btn-default submit-btn">Submit <span class="glyphicon glyphicon-log-in"></span> </a> </div> </div> </div> <div class="col-lg-6 col-md-6 col-sm-4 "></div> </div> </body>
.login2background{ background-image: url(https://s13.postimg.org/8xs7irifb/education2.png); background-repeat:no-repeat; background-attachment: fixed; background-size: cover; } .loginbox{ background: white; color: black; margin-top: 30%; left: 0; padding: 20px; box-shadow: 0 8px 50px -2px #000; border-radius:5px; } .logo{ width: 130px; height: 55px; margin-left: 10%; } @media (max-width:767px) { .loginbox{ margin-top: 10%; } } .loginbox_content{ padding:5% 11% 5% 11%; } .singtext{ font-family: "Open Sans",sans-serif; font-size: 27px; color: #82C226; float: right; padding-right: 25%; } .submit-btn{ float: right; margin-right: 28%; } .forgotpassword{ padding-left: 10%; } @media (max-width:800px) { .submit-btn{ margin-right: 23%; } }

Related: See More

Fresh Bootstrap Table
login-form
Login Form
Bootstrap 4 login from

Questions / Comments: