Fur*_*man 2 html css twitter-bootstrap twitter-bootstrap-3
我有以下HTML代码:
<div class="col-sm-4">
<div class="form-group" class="form-inline">
<span style="white-space: nowrap">
<label for="size">Board size:</label>
<select class="form-control" id="size" style="background-color: black; color: silver">
<option>small</option>
<option>medium</option>
<option>large</option>
<option>huge</option>
</select>
</span>
</div>
</div>
我想要实现的是选择表单及其标签在同一行.我尝试从stackoverflow的类似问题中应用解决方案.Span with white-space: nowrap不起作用,既没有也没有class="form-inline"回答这个问题:在Bootstrap 3中的同一行中选择下拉按钮和表单 如何解决？
小智 6
你要这个
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
</head>
<body>
<form class="form-inline">
<div class="form-group">
<label for="size">Board size:</label>
<select class="form-control" id="size" style="background-color: black; color: silver">
<option>small</option>
<option>medium</option>
<option>large</option>
<option>huge</option>
</select>
</div>
</form>
</body>
</html>这是一种方式:
Bootply:http://www.bootply.com/YzaMGyRq99
CSS:
select.form-control{display:inline-block}
HTML:
<div class="col-sm-4">
<div class="form-group">
<span style="white-space: nowrap">
<label for="size">Board size:</label>
<select class="form-control" id="size" style="background-color: black; color: silver">
<option>small</option>
<option>medium</option>
<option>large</option>
<option>huge</option>
</select>
</span>
</div>
</div>
| 归档时间： |
|
| 查看次数： |
6683 次 |
| 最近记录： |