控件组
.input-group 表示控件组
.input-group-addon 可放置额外内容及图标
控件组
.input-group 表示控件组
.input-group-addon 可放置额外内容及图标
.input-group 表示控件组
.input-group-addon 可放置额外内容及图标
Bootstrap4.0写法 <div class="input-group"> <span class="input-group-text" >$</span> <input type="text" class="form-control" > </div>
input控件组.input-group <div class="input-group"> <span class="input-group-addon">放置额外的内容及图标</span> <input type="text" class="form-control "> </div> 按钮控件组 <div class="btn-group"> <button class="btn btn-default"></button> </div>
<div class="input-group">
<span class="input-group-addon">$</span>
<input type="text" class="form-control">
</div>
<div class="input-group input-group-lg">
<span class="input-group-addon">$</span>
<input type="text" class="form-control">
</div>
<div class="dropdown">
<button class="btn btn-default btn-danger dropdown-toggle" data-toggle="dropdown">菜单项<span class="caret"></span></button>
<ul class="dropdown-menu">
<li class=""><a href="www.baidu.com">百度</a></li>
<li class=""><a href="www.baidu.com">百度</a></li>
<li class=""><a href="www.baidu.com">百度</a></li>
<li class=""><a href="www.baidu.com">百度</a></li>
</ul>
</div>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Mooc网学习</title> <link href="css/bootstrap-theme.min.css"rel="stylesheet"> <link href="css/bootstrap.min.css"rel="stylesheet"> </head> <body> <div class="input-group"> <span class="input-group-addon">$</span> <input type="text"class="form-control"> </div> </body> </html>

控件组
1
input控件组.input-group <div class="input-group"> <span >.input-group-addon放置额外的内容及图标</span> <input type="text" class="form-control "> </div> 按钮控件组 <div class="btn-group"> <button class="btn btn-default"></button> </div>