用bootstrap写一个登陆页
2024-09-21 05:28:52
<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>
如图:
最新文章
- Javascript 接口模拟
- ios原声音频播放AVAudioSession 总结
- solr 日期查询格式
- dll的导入库(lib)输出路径
- ecshop /includes/init.php Arbitrary User Login Vul
- IOS中多版本,多设备类型支持注意事项
- spring项目中使用weblogic的连接池
- Modernizr.js入门指南(HTML5&;CSS3浏览器兼容插件)
- Oracle 课程八之性能优化之10046事件
- setuptools的使用
- Hbase学习笔记(安装和基础知识及操作)
- 管理 MariaDB 用户账户
- mac air中编译安装swoole
- sort函数比较cmp写法
- 17中介者模式Mediator
- linux yum+wget详解
- module &#39;pip&#39; has no attribute &#39;pep425tags&#39;
- 如何将mysql卸载干净
- Kafka:ZK+Kafka+Spark Streaming集群环境搭建(八)安装zookeeper-3.4.12
- Ubuntu下更改Vim配置文件打造C/C++风格