Question

在Android网络浏览器上（我在Android 2.3上看到这个），当触摸收音机或复选框等Html输入时，会显示一个简短的橙色高亮显示（参见附图）。我在桌面Chrome或其他浏览器上看不到相同的亮点。

无论如何我可以控制这个亮点吗？我可以通过CSS或Javascript进行更改吗？

enter image description here

Answer 1

您可以将-webkit-tap-highlight-color属性设置为带有0 alpha的rgba值以禁用所有这些。

这是您可以尝试的快速测试页面。我刚用Android 4.0.3进行了测试，但是它是从我在2.3.3中做过的一些早期的东西中获得的。

希望这有帮助！

<!DOCTYPE html>  
<html lang="en">  
    <head>  
        <meta http-equiv="Content-Type" content="text/html" charset="utf-8">  
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1">  
        <title>Android Test Select</title>  
        <base href="" />  
        <style>  
            .no-hi {  
                -webkit-tap-highlight-color: rgba(255, 255, 255, 0);  
            }  
        </style>  
    </head>  
    <body>  
        <form>  
            <input type="radio" name="highlight" value="these" /> These<br />  
            <input type="radio" name="highlight" value="should" /> Should<br />  
            <input type="radio" name="highlight" value="highlight" /> Highlight  
            <hr/>  
            <input type="radio" name="no-highlight" value="these" class="no-hi" /> These<br />  
            <input type="radio" name="no-highlight" value="should" class="no-hi" /> Should<br />  
            <input type="radio" name="no-highlight" value="not" class="no-hi" /> Not  
        </form>  
    </body>  
</html>

Answer 2

也许？

input { outline: none; }

或焦点可能更好

input:focus { outline: none; }

如何在Android网页浏览器中控制html输入控件周围的橙色高光？

2 个答案: