首页 > 代码库 > Bootstrap中水平排列的表单form-inline
Bootstrap中水平排列的表单form-inline
1 <html> 2 <head> 3 <title>初识Bootstrap</title> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css"> 7 </head> 8 <body> 9 10 <form class="form-inline" role="form">11 <div class="form-group">12 <label for="f1">账号</label>13 <input type="text" id="f1" class="form-control" placeholder="请输入账号"/>14 </div>15 <div class="form-group">16 <label for="f2">密码</label>17 <input type="password" id="f2" class="form-control" placeholder="请输入密码"/>18 </div>19 <div class="form-group">20 <label for="f3" class="sr-only">邮箱</label>21 <input type="email" class="form-control" id="f3" placeholder="请输入邮箱"/>22 </div>23 <div class="form-group">24 <label for="f4" class="sr-only">邮箱秘密</label>25 <input type="password" id="f4" placeholder="请输入邮箱密码" class="form-control"/>26 </div>27 <div class="checkbox">28 <label>29 <input type="checkbox"/>记住密码30 </label>31 </div>32 <button type="submit" class="btn btn-danger">进入</button>33 </form>34 35 36 37 38 39 <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>40 <script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>41 </body>42 </html>
Bootstrap中水平排列的表单form-inline
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。