本文介绍了Bootstrap 5表单组、表单行、内联表单不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试将我的应用程序从Bootstrap 4更新到Bootstrap 5，但使用表单类的所有元素(如form-group、form-row、form-inline)都完全损坏。
推荐答案
原因是form-group、form-row和form-inline类已在引导5中删除：
突破性变化：删除了网格系统的特定于表单的布局类。使用我们的网格和实用程序，而不是.form-group、.form-row或.form-inline。
https://getbootstrap.com/docs/5.0/migration/#forms
应改为使用Grid和Utilities。
...但如果您正在寻找快速解决方案，以下是这些类在Bootstrap 4中的工作方式：
.form-group {
margin-bottom: 1rem;
}
.form-inline .form-control {
display: inline-block;
width: auto;
vertical-align: middle;
}
.form-row {
display: flex;
flex-wrap: wrap;
margin-right: -5px;
margin-left: -5px;
}
label {
margin-bottom: 0.5rem;
}
这篇关于Bootstrap 5表单组、表单行、内联表单不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除！