"My simple CSS_login"
Bootstrap 3.3.0 Snippet by Tumedi

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> <div> <div class="fixed"> <form action="action_page.php"> <div class="position"> <H1><c>Login</c></H1> <label for="lblUsername">Username</label> <br> <input type="text" id="txtUsername" name="Username"> <br> <label for="lblPassword">Password</label> <br> <input type="text" id="txtPassword" name="Password"> <br> <button type="button" class="btn btn-Login">Login</button> </div> </form> </div> </div> </body> </html>
h1{color:black;} body { background-color: white; } button { display: inline-block; padding: 20px 25px; font-size: 24px; cursor: pointer; text-align: center; text-decoration: none; outline: none; color: #fff; background-color: grey; border: none; border-radius: 15px; box-shadow: 0 9px #999; width: 30%; } button:active { background-color: #3e8e41; box-shadow: 0 5px #666; transform: translateY(4px); } input[type=text], select { width: 30%; padding: 12px 20px; margin: 8px 0; display: inline-block; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; } input[type=submit] { width: 50%; background-color: Aqua; color: white; padding: 200px 20px; margin: 8px 0; border: none; border-radius: 4px; cursor: pointer; } .position { margin: auto; width: 60%; border: 3px solid #73AD21; padding: 10px; background-color: aqua; }

Related: See More

Argon Design System
Simple Vertical timeline
Simple white navbar
BS4 clean & simple invoice template

Questions / Comments: