API tools faq
paste
Advertisement
Guest User

Login HTML

a guest
May 14th, 2015
281
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.16 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.         <meta name="viewport" content="width=device-width, initial-scale=1">
  7.  
  8.         <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  9.         <meta name="description" content="Site Description">
  10.         <meta name="author" content="Site Author">
  11.         <link rel="icon" href="favicon.ico">
  12.  
  13.         <title>Free Bootstrap Login</title>
  14.         <!-- Credits -->
  15.         <!--
  16.            Image Credit:
  17.            https://www.flickr.com/photos/ragnagne/2473176843/in/photolist-fxaD6m-4LxFj4-8ginSy-fwViYX-8HPiov-fxaCMd-8TE6a-fwVjXr-oWUfCD-dwfjaE-3EdLYm-9w9HqZ-dkH9DV-8zHPyH-769aHi-qHMnr-2Ho25t-5SzASB-9z3V5b-5SDXe9-fmRzgE-2iXuiB-58Xpo-7U3ZY-hMQvp-fwVjiK-7ivUMs-es6EVW-dmyfCP-5EKYcN-8TE8y-66URV8-4uL9Sb-eaE97-b1Br7-6U9GB1-5ERs8L-8pLdHz-bQB2He-2Ho3uM-nYxGuM-nYfvja-nYfwVg-o1k8Et-rnoDj-dNrxfQ-9hoEeP-4DWCjY-dA6ygq-dRAzXS
  18.        -->
  19.  
  20.         <!-- Bootstrap core CSS -->
  21.         <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
  22.  
  23.         <!-- Custom CSS files -->
  24.         <link href="css/login.css" rel="stylesheet">
  25.  
  26.         <!--- Fonts -->
  27.         <link href='http://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
  28.  
  29.         <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
  30.         <!--[if lt IE 9]>
  31.            <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  32.            <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  33.        <![endif]-->
  34.     </head>
  35.     <body>
  36.  
  37.         <!-- div.navbar -->
  38.         <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
  39.             <div class="container">
  40.                 <div class="navbar-header">
  41.                     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
  42.                         <span class="sr-only">Toggle navigation</span>
  43.                         <span class="icon-bar"></span>
  44.                         <span class="icon-bar"></span>
  45.                         <span class="icon-bar"></span>
  46.                     </button>
  47.                     <a class="navbar-brand" href="#">Lorem Ipsum</a>
  48.                 </div>
  49.  
  50.                 <div class="collapse navbar-collapse">
  51.                     <ul class="nav navbar-nav">
  52.                         <li><a href="#">Login</a></li>
  53.                         <li><a href="#">Storyline</a></li>
  54.                         <li><a href="#">Screenshots</a></li>
  55.                         <li><a href="#">Register</a></li>
  56.                         <li><a href="#">Contact Us</a></li>
  57.                     </ul>
  58.                 </div>
  59.             </div>
  60.         </div>
  61.         <!-- /div.navbar -->
  62.  
  63.         <!-- div.container -->
  64.         <div class="container-fluid">
  65.             <!-- div.row (Splash) -->
  66.             <div class="row spacer">
  67.  
  68.                 <div class="col-md-6 login-image">&nbsp;</div>
  69.  
  70.                 <div class="col-md-4 col-md-offset-1 title">
  71.                     <h1>Lorem Ipsum</h1>
  72.                     <h3>Lorem ipsum dolor sit amet, consectetur adipiscing elit!</h3>
  73.                     <p>
  74.                         <a class="btn btn-danger" href="#" role="button">Register Today</a>
  75.                     </p>
  76.                 </div>
  77.  
  78.             </div>
  79.             <!-- /div.row (Splash)-->
  80.  
  81.             <!-- div.row -->
  82.             <div class="row spacer">
  83.  
  84.                 <!-- div.col-md-4 (Login) -->
  85.                 <div class="col-md-4  col-md-push-4 col-md-offset-2 spacer">
  86.                     <h3>Login</h3>
  87.                     <form method="post" action="#">
  88.  
  89.                         <div class="form-group">
  90.                             <label for="Username">Username</label>
  91.                             <input type="text" class="form-control" id="Username" placeholder="Enter username...">
  92.                         </div>
  93.  
  94.                         <div class="form-group">
  95.                             <label for="Password">Password</label>
  96.                             <input type="text" class="form-control" id="Password" placeholder="Enter password...">
  97.                         </div>
  98.  
  99.                         <button type="submit" class="btn btn-primary">Sign In</button>
  100.                     </form>
  101.                 </div>
  102.                 <!-- /div.col-md-4 (Login) -->
  103.  
  104.                 <!-- div.col-md-4 (About) -->
  105.                 <div class="col-md-4  col-md-pull-4 spacer">
  106.                     <h3>About</h3>
  107.                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus massa neque, maximus non nunc vel, commodo vehicula nunc. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum sed ipsum at neque gravida scelerisque. Ut orci sapien, ultrices a augue eu, fringilla rhoncus lectus. Pellentesque eu nibh a augue cursus condimentum id ac metus. Nam elementum purus justo, pellentesque laoreet elit tincidunt vitae. Donec semper risus ut dolor mattis tempus.</p>
  108.                 </div>
  109.                 <!-- /div.col-md-4 (About) -->
  110.  
  111.             </div>
  112.             <!-- /div.row -->
  113.         </div>
  114.         <!-- /div.container -->
  115.  
  116.         <!-- Bootstrap core JavaScript
  117.        ================================================== -->
  118.         <!-- Placed at the end of the document so the pages load faster -->
  119.         <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
  120.         <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
  121.  
  122.         <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
  123.         <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/ie10-viewport-bug-workaround.js"></script>
  124.  
  125.         <script>
  126.             $(document).ready(function() {
  127.  
  128.                 $('ul.navbar-nav li').removeClass('active');
  129.                 $('a[href="'+document.location.href+'"]').parents('li').addClass('active');
  130.             });
  131.         </script>
  132.  
  133.     </body>
  134. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!