Bootstrap 表单布局示例
Posted ms_senda
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Bootstrap 表单布局示例相关的知识，希望对你有一定的参考价值。
<html> <head> <link href="../../dist/css/bootstrap.min.css" rel="stylesheet"> <style type="text/css"> h4 margin-top: 25px; .row margin-bottom: 20px; .row .row margin-top: 10px; margin-bottom: 0; [class*="col-"] padding-top: 15px; padding-bottom: 15px; /* background-color: #eee; */ /* background-color: rgba(86,61,124,.15); */ /* border: 1px solid #ddd; */ border: 1px solid rgba(86, 61, 124, .2); hr margin-top: 40px; margin-bottom: 40px; </style> </head> <body> <div class="panel panel-default"> <!-- Default panel contents --> <div class="panel-heading">Panel heading</div> <div class="panel-body"> <!-- <div class="form-inline"></form> --> <div class="form-inline"> <div class="form-group"> <label class="sr-only" for="exampleInputEmail3">Email address</label> <input type="email" class="form-control" id="exampleInputEmail3" placeholder="Email"> </div> <div class="form-group"> <label class="sr-only" for="exampleInputPassword3">Password</label> <input type="password" class="form-control" id="exampleInputPassword3" placeholder="Password"> </div> <div class="checkbox"> <label> <input type="checkbox"> Remember me </label> </div> <button type="submit" class="btn btn-default">Sign in</button> </form> </div> <!-- Table --> <table class="table"> </table> </div> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">Panel title</h3> </div> <div class="panel-body"> <div class="row"> <div class="col-xs-6"><label>工单号：</label>8794949</div> <div class="col-xs-6"><label>制造订单：</label>8794949</div> </div> </div> </div> </body> </html>
以上是关于Bootstrap 表单布局示例的主要内容，如果未能解决你的问题，请参考以下文章