Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
- <title>Login</title>
- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
- <style>
- @font-face {
- font-family: 'DBHeavent';
- src: url("fonts/DBHeaventd41d.eot?#iefix") format("embedded-opentype"), url("fonts/DBHeavent.woff") format("woff"), url("fonts/DBHeavent.ttf") format("truetype"), url("fonts/DBHeavent.svg#DBHeavent") format("svg");
- font-weight: normal;
- font-style: normal
- }
- @font-face {
- font-family: 'DBHeavent-Med';
- src: url("fonts/DBHeavent-Medd41d.eot?#iefix") format("embedded-opentype"), url("fonts/DBHeavent-Med.woff") format("woff"), url("fonts/DBHeavent-Med.ttf") format("truetype"), url("fonts/DBHeavent-Med.svg#DBHeavent-Med") format("svg");
- font-weight: normal;
- font-style: normal
- }
- body {
- /* font-family: 'DBHeavent' !important; */
- line-height: 1.7;
- font-weight: 500;
- font-size: 1.1rem;
- background: #000000 url(bg_image_hori.jpg);
- background-position: center;
- background-size: cover;
- display: inline-block;
- background-attachment: fixed;
- width: 100%;
- }
- .login_form {
- box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
- padding: 5%;
- }
- .input_txt {
- color: #a9a9a9 !important;
- text-align: center;
- width: 100%;
- border: none;
- background: rgba(0, 0, 0, 0.4);
- }
- .inputBox {
- padding: 0 10%;
- }
- input[type=text].input_txt:focus,
- input[type=password].input_txt:focus {
- border: none;
- outline: none;
- }
- @media (min-width: 992px) {
- .login_form {
- background: #000000 url(bg_image_hori.jpg);
- background-position: center;
- background-size: 90%;
- display: inline-block;
- background-attachment: fixed;
- width: 100%;
- }
- .txt_title {
- font-size: 35px;
- }
- .inputBox .input_txt,
- .inputBox .btn_login {
- height: 130px;
- margin-bottom: 45px;
- }
- .input_txt,
- .btn_login {
- font-size: 45px;
- border-radius: 15px;
- }
- .inputBox {
- width: 990px;
- margin: auto;
- }
- .img_logo {
- width: 480px;
- }
- }
- @media (max-width: 992px) {
- .login_form {
- background: #000000 url(bg_image.jpg);
- background-position: center;
- background-size: cover;
- display: inline-block;
- background-attachment: fixed;
- width: 100%;
- }
- .txt_title {
- font-size: 18px;
- }
- .inputBox .input_txt,
- .inputBox .btn_login {
- height: 65px;
- margin-bottom: 15px;
- }
- .input_txt,
- .btn_login {
- font-size: 22px;
- border-radius: 5px;
- }
- .container {
- padding: 0;
- }
- .img_logo {
- width: 300px;
- }
- .login_form {
- height: 100vh;
- }
- }
- @media (min-width: 1200px) {
- .container {
- max-width: 1720px !important;
- }
- }
- </style>
- </head>
- <body>
- <div class="container">
- <div class="login_form">
- <span class="text-white txt_title">แนะนำ : Chrome Browser</span>
- <div class="b_login text-center mt-5">
- <img src="https://www.ufacash.com/member/assets/img/ufacashnewlogo2.png" class="img_logo" alt="">
- <br>
- <h3 class="text-white mt-5">ลงชื่อเข้าใช้งานบัญชี</h3>
- <div class="inputBox mt-5">
- <form action="" method="post">
- <input type="text" id="usename" name="usename" class="input_txt" placeholder="ชื่อผู้ใช้">
- <input type="password" id="password" name="password" class="input_txt" placeholder="รหัสผ่าน">
- <button type="button" class="btn btn-info btn_login btn-block">เข้าสู่ระบบ</button>
- </form>
- </div>
- </div>
- </div>
- </div>
- <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js">
- </script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js">
- </script>
- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js">
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement