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;
}

效果如下

相关推荐
走粥23 分钟前
clsx和twMerge解决CSS类名冲突问题
前端·css
Purgatory00142 分钟前
layui select重新渲染
前端·layui
weixin199701080161 小时前
《中国供应商商品详情页前端性能优化实战》
前端·性能优化
赵孝正3 小时前
学习的本质是一个工程闭环:从模仿到内化的四阶段方法论(附风电实战案例)
前端·数据库·学习
Panzer_Jack5 小时前
easy-live2d v0.4.0 — 全面进化的 Live2D Web 开发体验
前端
软弹5 小时前
输入URL之后,都发生了什么
前端
2601_954023665 小时前
Architecting for Tomorrow: The 2025 High-Performance Stack for Agencies
java·前端·python·seo·wordpress·gpl
吠品5 小时前
CSS图片居中:Flexbox、Grid与Transform的完整指南
前端·css
可问春风_ren5 小时前
HTML零基础进阶教程:解锁表单、多媒体与语义化实战
前端·git·html·ecmascript·reactjs·js