在某些设备的 Bootstrap 选择中隐藏选项值答案

【问题标题】：hide option value in Bootstrap select for certain devices在某些设备的 Bootstrap 选择中隐藏选项值
【发布时间】：2015-10-20 16:28:46
【问题描述】：

我有一个“状态”表单字段的引导选择菜单。在较大的设备上，每个下拉菜单都有标签，但在较小的设备上，它们是隐藏的。因此，为了让较小的设备知道菜单的用途，我将“状态”一词作为第一个下拉选项。

<div class="form-group">
<label class="col-sm-3 control-label" for="textinput">*State</label>
<div class="col-xs-5 col-lg-3">
<select id="state" class="form-control" name="state">
<option value="State">State</option>
<option value="AA">AA</option>...

有没有更好的方法来包含“状态”这个词而不是一个选项值？无论哪种方式，我怎样才能让它在较小的设备上显示，但在较大的设备上保持隐藏（标签将显示在哪里）？

谢谢

【问题讨论】：

您可能想查看引导程序中的下拉菜单。我不确定您希望状态选项做什么，但如果您希望用户能够选择一个状态，那就是您的答案。多级下拉菜单。此外，您还可以确保移动适应性。

标签： html css twitter-bootstrap

【解决方案1】：

您可以使用媒体查询来定义屏幕尺寸：

@media (min-width: 768px) {
}

然后定位您不想在 CSS 中显示的任何内容？

【讨论】：

我试过了。但是，它不起作用。和 @media (min-width: 991px) {.mobile-only {display:none}}
嘿，在媒体查询中，您必须重新定义您要定位的类。