`
liuguofeng
  • 浏览: 449544 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

去除android浏览器中a、input获得焦点时的高亮边框

 
阅读更多

当a,input等元素在android原生浏览器下获得焦点时,元素外围会出现一个橙色的高亮边框(如下图)。
input 高亮边框

若要去除它,通常的方法为:
a:focus,input:focus{ -webkit-tap-highlight-color:rgba(0,0,0,0); }
不过看起来,这种方案在android 4.0以上版本的浏览器中是无效的。

一种在android 4.0以上版本浏览器中可以移除高亮边框的办法是:
a:focus,input:focus{ -webkit-user-modify:read-write-plaintext-only; }

所以,把上面两种方法结合起来,就是目前一个相对完整的‘去除android浏览器下a/input等元素获得焦点时高亮边框’的解决方法:
 

复制代码代码示例:
a:focus,input:focus{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-user-modify:read-write-plaintext-only;
}
分享到:
评论

相关推荐

    html文本框input表单输入框默认提示信息插件,获得焦点自动清空默认值,失去焦点对比确认默认值

    2 当input获得焦点时 input的值会被自动清除;当input失去焦点时 会判断输入值与默认值是否一致 如果一致(或空)则再次显示默认提示信息 若不一致(已输入信息)则input值为所输入值 3 此插件是jquery插件 调用方式...

    HTML5 INPUT文本框点击高亮特效.rar

    在这个代码片段中,`:hover`伪类用于在鼠标悬停时改变边框颜色,`:focus`伪类则在输入框获取焦点(即被点击)时应用高亮效果。`transition`属性使得颜色和阴影的变化过程更加自然。 在实际项目中,为了保持代码的...

    vue3 获取焦点,vu3 input 获取焦点 Vue 3 focus input

    我们都知道在vue2中获取焦点为,然后调用focus方法 this.$nextTick(()=>{ this.$refs.XXX.focus() }) 现在我们的vue3怎么获取焦点,请看附件,已经正常使用。 请放心下载

    jquery模拟safari浏览器输入框获取焦点后边框阴影

    在本案例中,我们将利用 jQuery 创建一个插件,模仿 Safari 浏览器的输入框焦点边框阴影。 首先,我们需要创建一个 jQuery 插件。插件的基本结构通常如下: ```javascript (function($){ $.fn.extend({ ...

    jquery模拟safari浏览器输入框获取焦点后边框阴影效果.zip

    在本文中,我们将深入探讨如何使用jQuery来模拟Safari浏览器中输入框获取焦点时的边框阴影效果。这个效果在用户交互中起到了很好的视觉引导作用,使得用户更容易注意到正在活动的元素。通过提供的"jquery模拟safari...

    取消chrome焦点边框效果(橘色)

    本篇将详细介绍如何通过CSS来取消Chrome浏览器中输入框(input)、按钮(button)、下拉选择(select)以及文本域(textarea)等元素获得焦点时显示的橘色边框。 #### 一、理解焦点样式 在大多数现代浏览器中,当某个表单...

    android input 事件的获取

    Android 操作系统中,input 事件是指用户与设备交互的过程,这包括 touch 事件、key 事件、鼠标事件等。了解 Android 获取 input 事件的机制,对于 Android 应用开发和设备驱动开发至关重要。 一、Input System ...

    js实现input文本框点击时文字消失,失去焦点时文字出现

    在JavaScript编程中,有时我们需要为输入框(input)设置一种特殊的行为,比如当用户点击输入框时,预设的文字消失,而当用户离开输入框(失去焦点)时,这些文字又重新出现。这种功能常见于搜索框或者密码输入等...

    Android 4.0 事件输入(Event Input)系统

    在 Android 4.0 中,TouchScreen 功能在移植到 Android 4.0 后不能正常工作了,这是因为 Android 4.0 中的 Event Input 系统的地位提高了,EventHub 成为系统中所有事件的中央处理站,并且 EventHub 的代码也发生了...

    Android InputMethod 源码流程图

    在Android中,每个应用窗口都有其焦点状态。当一个窗口(如Activity)获取焦点时,它可能需要显示或隐藏输入法,这取决于窗口中是否有需要输入的视图。`InputMethodManagerService`会监听窗口焦点变化,以便决定...

    AndroidInput子系统架构.pdf

    Android Input 子系统架构是 Android 操作系统中负责处理输入事件的子系统。该子系统的架构可以分为两部分:Java 层和 Native 层。 Java 层的 InputManager 类是整个 Android Input 子系统的上层代码最重要的类。该...

    android webview input=file 失效解决方案

    在Android开发中,Webview是一个重要的组件,它允许我们在原生应用中内嵌网页内容,提供混合式应用的用户体验。然而,在使用Webview时,有时会遇到一个问题:当HTML页面中包含`<input type="file">`用于上传文件的...

    去掉谷歌浏览器获取焦点时默认的input、textarea的边框和背景

    1、使用Chrome的都知道,当鼠标焦点在input、textarea这些元素上时,Chrome默认的会给它们加上黄色的边框,我以前一直以为这是chrome的特性,没法去掉,原来是css的效果,outline这个属性。 你可以用下面的css代码...

    android4.0 input touch分析

    因为 android4.0 下的导航栏是 systemui 画的,无法去掉,因此在校准程序里面通过 display 得到分辨率高度比实际的小,差的那部分就是导航栏的高度。如果以小的高度进行校准,但使用实际的高度进行触摸坐标到屏幕...

    input边框变色.rar

    input边框变色,这个教程由小编亲自整理,亲测有效实用。当用户在输入框输入账号密码或文本时,边框颜色发生变化,边框变蓝、黄色等。需要的小伙伴赶快下载吧,本方法简单实用,输入框输入时边框颜色变化实用教程!

    iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案

    iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案 兼容ios8 ios9 ios 10

    Android-Android-Prefix-Input为EditText添加prefix前缀模式

    在Android应用开发中,UI设计和用户体验是至关重要的部分,特别是在涉及到用户交互的文本输入时。`Android-Prefix-Input`项目就是针对这种情况提供的一种解决方案,它允许开发者为`EditText`组件添加前缀(Prefix)...

    【JavaScript源代码】element input输入框自动获取焦点的实现.docx

    在JavaScript和Vue.js开发中,有时我们需要实现一种功能,即当页面加载或特定事件发生时,使输入框(input)自动获取焦点。这样的需求在创建表单或评论系统时尤其常见,用户可以直接开始输入而无需手动点击输入框。...

    深究AngularJS—如何获取input的焦点(自定义指令)

    在AngularJS中,获取输入元素(input)的焦点是一项常见的需求,尤其在用户交互或表单自动填充时。本文将深入探讨如何通过自定义指令来实现这一功能,以便更好地理解和掌握AngularJS的核心机制。 首先,我们需要了解...

    Android EditText(失焦+焦点)+登录界面

    焦点管理在Android中至关重要,因为只有一个View可以拥有焦点,而这个焦点决定了哪个View可以接收用户的输入事件。当用户点击或触摸屏幕时,系统会将焦点转移到被点击的View。对于`EditText`,我们可以使用以下方法...

Global site tag (gtag.js) - Google Analytics