各大浏览器兼容整理

最新推荐文章于 2023-07-11 20:58:16 发布

三金de鑫

最新推荐文章于 2023-07-11 20:58:16 发布

阅读量757

点赞数 1

CC 4.0 BY-SA版权

分类专栏： html5

本文链接：https://blog.youkuaiyun.com/qq_42345237/article/details/99072273

html5 专栏收录该内容

8 篇文章

订阅专栏

本文分享了处理不同浏览器兼容性问题的实用技巧，包括火狐浏览器的事件识别、360和搜狗浏览器的CSS兼容性调整、chrome浏览器的input自动补全样式去除，以及实现滚动效果同时隐藏滚动条的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.火狐浏览器不识别event，需要手动添加：

var event=window.event||arguments.callee.caller.arguments[0];

2.在360，搜狗等浏览器兼容模式下css——initial，unset，反引号不识别，无法兼容
3.chrome浏览器去掉input自动补全后的黄色样式：

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
-webkit-transition-delay: 99999s;
-webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
/* -webkit-box-shadow: 0 0 0px 1000px white inset; */
}

4.div隐藏滚动条仍保留滚动效果（看其他大神的）
就是用两个div包装，最外层div设置overflow:hidden,里面那层设置overflow-y: scroll;并且最里面的宽度是最外面宽度+15像素，这15像素就是右侧滚动条的宽度。