在表单组中的文本框旁边对齐一个按钮,可以通过以下步骤实现:
<div class="form-group">
<input type="text" class="form-control" id="inputText">
<button type="button" class="btn btn-primary">按钮</button>
</div>
使用flexbox布局的示例:
.form-group {
display: flex;
align-items: center;
}
.form-control {
margin-right: 10px;
}
使用浮动的示例:
.form-group {
overflow: hidden;
}
.form-control {
float: left;
margin-right: 10px;
}
var button = document.querySelector('.btn');
button.addEventListener('click', function() {
// 处理按钮点击事件
});
这样,就可以在表单组中的文本框旁边对齐一个按钮了。根据具体的需求,可以根据以上步骤进行定制化的样式和交互设计。
领取专属 10元无门槛券
手把手带您无忧上云