更新时间:2023年02月10日
最优建议及卡顿情况报告
- 最佳浏览器:Chromium 版本不低于 100 的 Edge 或 Chrome。
- 最佳分辨率:电脑端设备高于 1920 × 1080 。
- 建议在本地安装以下字体获得最佳体验:苹方、得意黑
- 因为使用了大量动画渲染,因此在性能一般的电脑上或没有开启硬件加速的浏览器,可能会出现卡顿。
最新版浏览器兼容性报告
Chrome / Edge / Opera
无问题
Safari ios
transform 和 border-radius 同时使用会导致 border-radius 失效 bug 已有替代方案 在父元素添加 transform:rotate(0deg)
white-space: nowrap 和 overflow-x: scroll 横向滚动失效 bug 无解
Firefox
部分动画运行时掉帧 浏览器问题 无解
overflow: overlay 失效 浏览器问题 无解
webkit 自定义进度条样式失 效浏览器问题 无解
transition 和 animation 同时使用会导致 animation-delay 对 transition 生效bug 无解
QQ 浏览器 / 360 浏览器
部分动画运行时掉帧 浏览器问题 无解
counter-reset 处理 calc 函数时无效 浏览器问题 无解
scale 不支持 浏览器问题 不影响关键浏览
transform scale 和 filter opacity 同时使用会导致 img 透明区域不透明并出现黑色bug 已有替代方案
IE 全系 / EdgeHTML / 夸克 / 手机版 UC 浏览器 / 手机版 QQ 浏览器
已放弃兼容
注:以上浏览器版本,均为截止上述更新日期最近的最新版进行测试。
本站使用的浏览器支持但未进入 W3C 标准的 CSS 属性报告
字体
-webkit-text-stroke
-webkit-text-fill
-webkit-text-size-adjust
-webkit-font-smoothing
-ms-text-size-adjust
-ms-word-wrap
-moz-osx-font-smoothing
区块
overflow overlay
-webkit-box-decoration-break
控件
-webkit-appearance
遮罩
-webkit-mask
多行省略
-webkit-box
-webkit-box-orient
-webkit-line-clamp
滚动
-webkit-scrollbar
-webkit-scrollbar-thumb
-webkit-overflow-scrolling