html - Bootstrap 的 'select' 不适用于较小的设备

Question

我一直在做一个项目，但我一直坚持做一件事，这让我很沮丧，即 Bootstrap 的“选择”在移动设备和标签设备上不起作用。我检查过 this stackoverflow 上的解决方案，但这对我来说没有用。

 <div class="form-group">
            <div class="row">
                <label class="control-label col-sm-3" for="religion">Religion:</label>
<div class="col-sm-8">
            <select class="form-control">
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option>5</option>
            </select>
            </div>
            </div>
        </div>

        <div class="form-group">
            <div class="row">
                <label class="control-label col-sm-3" for="race">Race:</label>

            <div class="col-sm-8">
            <select class="form-control">
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option>5</option>
            </select>
            </div>
            </div>
        </div>

        <div class="form-group">
            <div class="row">
                <label class="control-label col-sm-3" for="country">Country:</label>

            <div class="col-sm-8">
            <select class="form-control">
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option>5</option>
            </select>
            </div>
            </div>
        </div>

请帮助我完成这项工作!

Answer 1

今天我遇到了同样的问题。

然后我发现唯一使用的类是col-sm-*，并且没有在元素上使用col-xs-*(移动设备)类，这导致无法在移动设备上访问表单输入。

与 col-sm-* 一起，将 col-xs-* 添加到您的类(class)列表中，使其适用于移动设备。

希望这对您有所帮助。干杯