浏览器用户代理版本:
"Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_2_1 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8C148 Safari/6533.18.5"
基本HTML代码
<!DOCTYPE html>
<html>
<head>
<title>Test Pages</title>
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
</head>
<body>
<div>
<select>
<option>One</option>
<option>two</option>
<option>three</option>
<option>four</option>
<option>five</option>
</select>
</div>
</body>
</html>
这似乎是工作在UIWebView(iPhone)和本机浏览器。只有android webView有这个问题。任何帮助都将不胜感激。webview是一个cordova活动
1条答案
按热度按时间mspsb9vt1#
来自here的@mattstow的回答
Android浏览器对
<select>
s的渲染存在错误,如果应用了背景或边框,将删除正常的样式。由于
<select>
s看起来不像<select>
s是一个相当大的可用性问题,因此您最好不要仅为该浏览器设置样式。不幸的是,没有纯粹的CSS方法来选择/排除Android浏览器,所以我建议您使用布局引擎(https://github.com/stowball/Layout-Engine),它将向
<html>
标记添加一个.browser-android类。然后,您可以设置除Android浏览器之外的所有
<select>
的样式,如下所示: