Bootstrap Grid：如何在较小的显示器上包装表单组

Question

我有一个引导网格，在中等屏幕上看起来不错。现在，我想在较小的屏幕（iPad）上进行改进。例如，将带有“Staatsangehörigkeit”的行打印到值中。

我尝试使用form-group col-sm播放，但是没有效果。

有什么建议吗？谢谢

<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
    <form>
        <div class="form-row">
            <div class="form-group col-md-2">
                <b>Geschlecht:</b>
            </div>
            <div class="form-group col-md-10">
                männlich
            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-md-2">
                <b>Name:</b>
            </div>
            <div class="form-group col-md-4">
                Wichtig-Ausnahmevereinbarung
            </div>
            <div class="form-group col-md-2">
                <b>Geburtsdatum:</b>
            </div>
            <div class="form-group col-md-4">
                11.11.1970
            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-md-2">
                <b>Geburtsname:</b>
            </div>
            <div class="form-group col-md-4">
                Mustermann
            </div>
            <div class="form-group col-md-2">
                <b>Staatsangehörigkeit:</b>
            </div>
            <div class="form-group col-md-4">
                deutsch
            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-md-2">
                <b>Geburtsort:</b>
            </div>
            <div class="form-group col-md-4">
                Musterhause
            </div>
            <div class="form-group col-md-2">
            </div>
        </div>
    </form>
</div>