twitter-bootstrap - Bootstrap 3输入附加问题

标签 twitter-bootstrap twitter-bootstrap-3

对不起我的英语不好。

您好,在 Bootstrap 3 中遇到一个问题,无法将两个文本字段和一个按钮进行分组。及时解决。

enter image description here

最佳答案

您可以这样做,使用一个输入组和两个输入字段,并添加一些 css:

HTML:

<div class="input-group double-input">
    <input type="text" placeholder="First" class="form-control" />
    <input type="text" placeholder="Second" class="form-control" />
    <span class="input-group-btn">
        <button class="btn btn-default" type="button">Go!</button>
    </span>
</div><!-- /input-group -->

CSS:
.double-input .form-control {
    width: 50%;
    border-right-width: 0px;
}
.double-input .form-control:focus {
    border-right-width: 1px;
}

检查这个 fiddle :http://jsfiddle.net/aorcsik/TshQ7/

关于twitter-bootstrap - Bootstrap 3输入附加问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19723359/

相关文章:

jquery - 在鼠标移动时设置 CSS 不适用于 Bootstrap

HTML对象标签不继承CSS

twitter-bootstrap - Zurb Foundation 比 Twitter Bootstrap 好吗?

css - hidden-xs hidden-sm 里面的视频下载了吗?

css - Bootstrap 中的 col-lg-*、col-md-* 和 col-sm-* 有什么区别?

javascript - HTML:JS:BOOTSTRAP ;验证多选下拉列表

css - Bootstrap 弹出窗口在悬停时闪烁

jquery-ui - 可使用 bootstrap 3 网格缩略图排序的 jQuery UI

html - .form-control 类上的 Bootstrap 3 : How to use . col 类

javascript - 当我单击它时,没有使用 data-toggle=tab 检查单选按钮