Android phonegap/引导程序样式问题

我有一个bootstrap（3.0rc1）应用程序，我开始在Phonegap/Cordova中测试它，发现了一些我不确定如何解决的样式问题

我想知道这是否是Bootstrap的问题，或者是否有人对Android嵌入式浏览器在某些样式规则下表现不好有过疑问

请参阅所附的屏幕截图了解正在发生的情况。您会注意到，select基本上没有样式，而input group按钮根本没有对齐。当作为一个普通页面使用时，这个页面在Chrome中非常有用。显示“Test！”的输入实际上是一个选择，样式为“表单控件”

---

您还可以看到其他样式工作正常（输入、按钮，甚至菜单栏）。

我也有同样的问题。在互联网上搜索并结合不同的解决方案后 我找到了这个

首先，如果用户代理是android，则此javascript将删除表单控件类 因此，您将拥有默认样式

var nua = navigator.userAgent
var isAndroid = (nua.indexOf('Mozilla/5.0') > -1 && nua.indexOf('Android ') > -1 && nua.indexOf('AppleWebKit') > -1 && nua.indexOf('Chrome') === -1)
if (isAndroid) {
    $('select.form-control').removeClass('form-control').css('width', '100%')
}

然后，您可以添加一些css

select{
  height:25px;
  width:100%;
  border: 1px solid grey;
  -webkit-appearance: listbox;
  background-image: url(data:image/png;base64,R0lGODlhDQAEAIAAAAAAAP8A/yH5BAEHAAEALAAAAAANAAQAAAILhA+hG5jMDpxvhgIAOw==); /* a simple arrow img */
  background-repeat: no-repeat;
  background-position: right center;
  padding-right: 20px;
  padding-left: 5px;
}

可选您甚至可以添加一些背景色

最重要的是

-webkit-appearance: listbox;

也可以设置为

-webkit-appearance: menulist-text;

---

到目前为止，您需要为select

提供一个类，我有这个类，并在上面指出：“表示‘Test！'的输入实际上是一个带有‘form control’样式的select。”请参见以下答案：