Question

我正在尝试创建Bootstrap表单并在所有屏幕宽度上强制“移动状态”视图。换句话说，我希望我的标签位于字段之上，而不是留在字段之上。这是我表格的一部分：

<form action="thanks.php" method="post" class="form-horizontal">
<fieldset>
    <div class="row">
        <div class="col-lg-6">
            <div class="form-group">
                <label class="col-md-3 control-label" for="textarea">Where?</label>
                <div class="col-md-6">
                    <textarea id="textarea" name="textarea" class="form-control "></textarea>
                </div>
            </div>
        </div>
    </div>
</fieldset>

Answer 1

您正在寻找的是BS3中的默认表单布局，但您的标记要比它需要的复杂得多。这样的事情应该能满足你的要求：

<form action="thanks.php" method="post" role="form">
    <fieldset>
        <label class="col-md-3 control-label" for="textarea">Where?</label>
        <textarea class="form-control" id="textarea" name="textarea" class="form-control "></textarea>
    </fieldset>
</form>

Bootply

Answer 2

只需将标签强制放入块元素：

<label for="textarea">Where?</label>
<div>
    <textarea id="textarea" name="textarea" class="form-control "></textarea>
</div>

label { display:block; }

您没有发布您的CSS，因此很难判断您是否正在这样做。

对于移动设备，我通常会将表单元素强制为宽度：97％。

Bootstrap 3形成强制全宽块标签

2 个答案: