用bootstrap写一个登陆页
<div class="container"> <p class="text-center marginTop35">后台管理系统</p> <p class="text-center marginTop20">会议管理系统</p> <div class="row marginTop20"> <div class="col-xs-8 col-xs-offset-2 col-sm-6 col-sm-offset-3 col-md-4 col-md-offset-4 border"> <div class="row marginTop35"> <div class="col padding10"> <p class="text-info">请输入您的登录信息</p> </div> </div> <div class="row marginTop20"> <div class="input-group"> <input type="text" class="form-control" placeholder="Recipient's username"> <span style="vertical:top;" class="input-group-addon "><i class="glyphicon glyphicon-user"></i></span> </div> </div> <div class="row marginTop20"> <div class="input-group"> <input type="text" class="form-control" placeholder="登录密码"> <span class="input-group-addon "><i class="glyphicon glyphicon-lock"></i></span> </div> </div> <div class="row marginTop20"> <div class="col-xs-6"> <div class="checkbox"> <label class="checkbox-inline"> <input type="checkbox" id="inlineCheckbox2" value="option2"> 管理员方式登录 </label> </div> </div> <div class="col-xs-6"> <div class="checkbox text-right text-danger"> <label class="checkbox-inline"> <input class="sr-only" type="checkbox" id="inlineCheckbox2" value="option2"> 忘记密码? </label> </div> </div> </div> <div class="row marginTop20"> <div class="col-xs-8 col-xs-offset-2 "> <div class="btn btn-info btn-lg btn-block"> <i class="glyphicon glyphicon-log-in"></i> 登录 </div> </div> </div> <div class="row marginTop20"> <div class="col-xs-6 padding10"> <i class="glyphicon glyphicon-arrow-left"></i> 团体注册 </div> <div class="col-xs-6 text-right padding10"> 个人注册 <i class="glyphicon glyphicon-arrow-right"></i> </div> </div> </div> </div> </div>
如图: