Question

在Android平板电脑上，使用Chrome，我正在显示自定义网页。在其中我有一些下拉控件（HTML5 SELECT）。使用这些控件，我试图通过减少显示的大小来显示更多的HTML OPTION元素。我的努力没有取得成功。在我的7英寸平板电脑上，选项始终显示只有大约12个元素填充显示屏（以纵向模式保持）。

例如，使用此CSS：

#distDV {
    font-size: 8pt;
    border-color: #999999;
}

#distDV option {
    font-size: 8pt;
    border-color: #999999;
}

使用此HTML：

<select id="distDV">
      <option value="30">+30</option>
      <option value="29">+29</option>
</select>

在台式计算机上（使用Chrome v.25或更高版本），选择下拉列表会显示较小的请求字体。当我单击控件以显示值时，选项也是一个很小的字体。

在我的Android平板电脑上（使用Chrome v.25或更高版本），选择下拉菜单会显示较小的请求字体。当我点击控件选择一个值时，android设备会在标准选项中选择全屏显示选项，在我的7英寸显示屏上使用大约12行从上到下。我试图通过CSS来实现这16行。

我正在寻找想法。是的，我已经尝试过使用optgroup，但没效果。

提前感谢，杰罗姆。

Answer 1

当您发现无法更改选项选择对话框的字体大小时。这是出于非常好的可用性原因。您是否有理由需要一次显示更多选项？为什么对话框的滚动不足以满足您的需求？另请记住，如果您将选项设置得太小，则可能会使用户感到沮丧。您可能能够准确地选择一个选项，但其他人可能没有。

所有这些都说你可以通过编码你自己的对话来解决这些限制，也许是通过使用单选按钮。例如：

<input type="radio" id="distDV30" name="distDV" value="30"><label for="distDV30">+30</label>
<input type="radio" id="distDV29" name="distDV" value="29"><label for="distDV29">+29</label>

然后你可以随心所欲地设计风格。另一种选择是使用输入框，如果所有选项都是数字，这可能更合适。 E，G：

<input type="number" name="distDV" min="1" max="30">

使用Android Chrome，html选项列表会忽略我的字体大小请求

1 个答案: