Bootstrap之制作登录表单

来源：互联网发布：临沂软件开发培训编辑：程序博客网时间：2024/05/17 04:24
代码

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <link rel="stylesheet" href="./bootstrap-3.3.7-dist/css/bootstrap.min.css">    <style>        .login {            color: white;            height: 38px;            width: 300px;            background-color: #2b669a;        }    </style></head><body><div class="container">    <h2 class="text-center">请登录</h2>    <div class="row">        <form class="form-horizontal col-md-offset-4 col-md-4">            <div class="form-group">                <label for="inputEmail3" class="col-sm-2 control-label">邮箱</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">密码</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">记住密码                        </label>                    </div>                </div>            </div>            <div class="form-group">                <div class="col-sm-offset-2 col-sm-10">                    <button type="submit" class="btn btn-default login ">登录</button>                </div>            </div>        </form>    </div></div></body></html>
效果图

阅读全文
0 0