Twitter bootstrap 自举形式-降低高度
有一个17行的表单（每行围绕2-3个控件）。复制了下面的示例html 1） 要求将所有控制装置的高度降低一半。初学者与引导和当前打击 2） 以及如何控制文本字段的输入大小 3） 也希望在一些控件周围使用fieldset 任何一个指针都很感激 谢谢Twitter bootstrap 自举形式-降低高度,twitter-bootstrap,Twitter Bootstrap,有一个17行的表单（每行围绕2-3个控件）。复制了下面的示例html 1） 要求将所有控制装置的高度降低一半。初学者与引导和当前打击 2） 以及如何控制文本字段的输入大小 3） 也希望在一些控件周围使用fieldset 任何一个指针都很感激 谢谢 <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<form class="form-horizontal" role="form">
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row11">Label11:</label>
</div>
<div class="col-sm-1">
<input type="text" class="form-control" id="row11"
placeholder="Data 11">
</div>
<div class="col-sm-1">
<label class="control-label" for="row12">Label12:</label>
</div>
<div class="col-sm-6">
<input type="text" class="form-control" id="row12">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-1">
<label class="control-label" for="row21">Label21:</label>
</div>
<div class="col-sm-1">
<input type="text" class="form-control" id="row21"
placeholder="Data21">
</div>
<div class="col-sm-1">
<label class="control-label" for="row22">Label22:</label>
</div>
<div class="col-sm-1">
<input type="text" class="form-control" id="row22" placeholder="Data 22">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row31">Label31:</label>
</div>
<div class="col-sm-1">
<input type="text" class="form-control" id="row31"
placeholder="Data31">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row41">Label41:</label>
</div>
<div class="col-sm-8">
<input type="text" class="form-control" id="row41"
placeholder="Data41">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-1 col-sm-8">
<input type="text" class="form-control" id="row41"
placeholder="Data42">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row51">Label51:</label>
</div>
<div class="col-sm-2">
<input type="text" class="form-control" id="row51"
placeholder="Data51">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row61">Label61:</label>
</div>
<div class="col-sm-2">
<input type="text" class="form-control" id="row61"
placeholder="Data61">
</div>
<div class="col-sm-offset-3 col-sm-1">
<label class="control-label" for="row62">Label62:</label>
</div>
<div class="col-sm-2">
<input type="text" class="form-control" id="row62"
placeholder="Data62">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row71">Label71:</label>
</div>
<div class="col-sm-2">
<input type="text" class="form-control" id="row71"
placeholder="Data71">
</div>
<div class="col-sm-offset-3 col-sm-1">
<label class="control-label" for="row72">Label72:</label>
</div>
<div class="col-sm-2">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
Ddown
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
</ul>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row81">Label81:</label>
</div>
<div class="col-sm-2">
<input type="text" class="form-control" id="row81"
placeholder="Data81">
</div>
<div class="col-sm-offset-3 col-sm-1">
<label class="control-label" for="row82">Label82:</label>
</div>
<div class="col-sm-2">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
Ddown
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
</ul>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row91">Label91:</label>
</div>
<div class="col-sm-3">
<input type="text" class="form-control" id="row91"
placeholder="Data91">
</div>
<div class="col-sm-offset-2 col-sm-1">
<label class="control-label" for="row92">Label92:</label>
</div>
<div class="col-sm-1">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
Ddown
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
</ul>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row101">Label101:</label>
</div>
<div class="col-sm-3">
<input type="text" class="form-control" id="row101"
placeholder="Data10-1">
</div>
<div class="col-sm-offset-2 col-sm-1">
<label class="control-label" for="row10-2">Label102:</label>
</div>
<div class="col-sm-1 dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
Ddown
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
</ul>
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row11-1">Label111:</label>
</div>
<div class="col-sm-3">
<input type="text" class="form-control" id="row11-1"
placeholder="Data11-1">
</div>
<div class="col-sm-offset-2 col-sm-1">
<label class="control-label" for="row11-2">Label112:</label>
</div>
<div class="col-sm-1">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
Ddown
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
</ul>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row12-1">Label121:</label>
</div>
<div class="col-sm-3">
<input type="text" class="form-control" id="row12-1"
placeholder="Data12-1">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row13-1">Label131:</label>
</div>
<div class="col-sm-4">
<input type="text" class="form-control" id="row13-1"
placeholder="Data13-1">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row14-1">Label141:</label>
</div>
<div class="col-sm-1">
<input type="text" class="form-control" id="row14-1"
placeholder="Data14-1">
</div>
<div class="col-sm-offset-1 col-sm-1">
<label class="control-label" for="row14-2">Label142:</label>
</div>
<div class="col-sm-2">
<input type="text" class="form-control" id="row14-2"
placeholder="Data14-2">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row15-1">Label151:</label>
</div>
<div class="col-sm-8">
<input type="text" class="form-control" id="row15-1"
placeholder="Data15-1">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row16-1">Label161:</label>
</div>
<div class="col-sm-8">
<input type="text" class="form-control" id="row16-1"
placeholder="Data16-1">
</div>
</div>
<div class="form-group">
<div class="col-sm-1">
<label class="control-label" for="row17-1">Label171:</label>
</div>
<div class="col-sm-8">
<textarea rows="3" class="form-control" id="row17-1"
placeholder="Data17-1"></textarea>
</div>
</div>
</form>
</div>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script
src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
标签11：
标签12：
标签21：
标签22：
标签31：
标签41：
标签51：
标签61：
标签62：
标签71：
标签72：
多恩
标签81：
标签82：
多恩
标签91：
标签92：
多恩
标签101：
Label102：
多恩
标签111：
标签112：
多恩
标签121：
标签131：
标签141：
标签142：
.form-widgets-sm label {
height: 15px;
}
.form-widgets-sm input {
height: 15px;
}