Bootstrap snippet: Site login page

designed to help people of all skill levels - designer or developer, huge nerd or early beginner.
copy and paste the code. Use it as a complete kit or use it to start something more complex.
tags: login,site,page,home

<div class="principal-container"> <div class="container bootstrap snippet"> <div class="row"> <div class="col-md-4 img-content"> <img class="img-home" src=""> </div> <div class="col-md-7 form-content"> <h1 class="title">Your Site Name.</h1> <p>Put here your site description for example: Bootdey is a gallery of free bootstrap framework snippet Html Css Js codes</p> <form class="form-horizontal" role="form"> <div class="form-group"> <label for="inputEmail3" class="col-sm-2 control-label">Email</label> <div class="col-sm-10"> <input type="email" class="form-control" id="inputEmail3" placeholder="Email"> </div> </div> <div class="form-group"> <label for="inputPassword3" class="col-sm-2 control-label">Password</label> <div class="col-sm-10"> <input type="password" class="form-control" id="inputPassword3" placeholder="Password"> </div> </div> <div class="form-group"> <div class="col-sm-offset-2 col-sm-10"> <div class="checkbox"> <label> <input type="checkbox"> Remember me </label> </div> </div> </div> <div class="form-group"> <div class="col-sm-offset-2 col-sm-10"> <button type="submit" class="btn btn-default">Sign in</button> </div> </div> </form> </div> </div> </div> </div>
body { background: #2E95EF; background-image: -moz-radial-gradient(center 45deg,circle cover, #9BD1FF, #2E95EF); background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%,800, from(#9BD1FF), to(#2E95EF)); padding-top: 15%; } .img-home { max-width: 335px; height:335px; } .img-content{ margin-right:40px; } .title { color: #fff; text-shadow: 1px 1px 0 #888; line-height: normal; font-weight: 1em; font-family: serif; font-size: 40px; margin-bottom: 10px; font-weight:bold; }

Site login page

  Jul 6th 2014, 20:02