android - 选择标签在原生 Android 浏览器上的样式不正确

Question

我试图在 Android (4.2.1) 的 WebView 中显示两个选择框，但它们的高度不正确。在更高的 Android 版本 (4.4.2) 中，使用相同的 CSS 结果是正确的。我正在使用 Bootstrap。

HTML代码:

    <div class="row col-xs-12 texto-cent barrasearch2 separacion-filas visible-xs" id="barraInbox">
       <div class="col-xs-12 col-sm-6 col-md-5 ident-der">
           <select size="1" name="cmd2" class="select-mod">
               <option value="mg_move">Move messages to</option>
               <option value="mg_copy">Copy messages to</option>
               <option selected="" value="mb_change">Open mailbox</option>
           </select>
           ...
      </div>
    </div>

CSS 代码:

.select-mod{
    height: 30px !important;
    font-size: 14px !important;
    -webkit-appearance: menulist !important;
    background-color: #fff;
    line-height: 1.42857143;
}

Android 4.2.1 中的结果:

正确结果:(使用 Bootstrap CSS 类)

谢谢你的提前!

Answer 1

这可能是由重要标记引起的，因为它们通常会有点弄乱我的 CSS。尝试更具体的 CSS 样式路径:

   #barraInbox div select.select-mod {
       height: 30px;
       font-size: 14px;
       -webkit-appearance: menulist;
       background-color: #fff;
       line-height: 1.42857143;
   }

如果不知道它们应该是什么样子，就很难说清楚。可能有更好的方法来做到这一点。你能链接一张它应该是什么样子的图片吗？