H5 处理点击元素高亮、自定义按钮、去除焦点边框

1、设置移动设备上点击元素时出现的高亮颜色

html 复制代码
*{
    -webkit-tap-highlight-color: transparent;
}

2、如果你想要自定义按钮的样式,你可以使用 -webkit-appearance: none; 来移除按钮的默认样式

html 复制代码
.button {
  -webkit-appearance: none;
  appearance: none; /* 兼容性更好的通用语法 */
  border: 1px solid #ccc;
  padding: 10px 20px;
  background-color: #f0f0f0;
  color: #333;
  font-size: 16px;
}

3、当您在输入框(input元素)中输入内容后,某些浏览器会自动为获得焦点的输入框添加一个轮廓(outline),

使用inpt:focu属性去除

html 复制代码
.search input:focus {
    outline: none;
}

效果如下

相关推荐
白开水都有人用6 小时前
前端 AES 加密 + 后端解密 + MD5 校验登录
前端
毛骗导演7 小时前
Cladue Code 源码解析-键盘事件与 Vim 模式:parse-keypress 解析状态机
前端·架构
渐儿7 小时前
GLB 模型压缩 — 完整流程与代码映射
前端
疯狂成瘾者7 小时前
Prompt分层策略
前端·数据库·prompt
kyriewen7 小时前
你的数据该在哪儿拿?Next.js三种姿势一次讲清
前端·javascript·next.js
前端AI充电站7 小时前
第 7 篇:让 RAG 答案可追溯:展示知识库引用来源
前端·人工智能·前端框架
MY_TEUCK7 小时前
【AI 应用】前端接口联调工程化:把 Swagger 接入沉淀成可复用 Skill
前端·人工智能·uni-app·状态模式
kyriewen7 小时前
别再乱装图片插件了!我手写了一个,能扒光整个网页(含背景/iframe/Shadow DOM)
前端·chrome·浏览器
rrr27 小时前
【前端开发】|GUI 基本概念和框架基础
前端·qt
方安乐7 小时前
前端“硬核”性能优化
前端