twitter-bootstrap – Bootstrap内联文本框和搜索按钮
发布时间:2020-12-18 00:20:23 所属栏目:安全 来源:网络整理
导读:我有搜索输入框,我想要使用bootstrap形式控制外观的bootstrap样式.问题是,我还希望搜索按钮与搜索框在同一行.我认为这可以使用form-inline完成,但是当我将类form-control添加到搜索框时,搜索按钮会被推送到下一行: div class="input-group" div class="form
我有搜索输入框,我想要使用bootstrap形式控制外观的bootstrap样式.问题是,我还希望搜索按钮与搜索框在同一行.我认为这可以使用form-inline完成,但是当我将类form-control添加到搜索框时,搜索按钮会被推送到下一行:
<div class="input-group" > <div class="form-inline"> <input id="address" type="textbox" placeholder="City or Zipcode" class="form-control" > <input class="btn btn-sm btn-primary" type="button" value="Search" id="addressSearch"> </div> </div> http://jsfiddle.net/TLEbG/ 如果我从输入文本框中删除class =“form-control”,该按钮将以内联方式显示: http://jsfiddle.net/ETs9M/ 如何保持form-contol框的样式,同时保持按钮内联? 解决方法
尝试使用输入组:
http://getbootstrap.com/components/#input-groups这会将按钮放在文本字段旁边并使其成为一个组件
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |