安卓的 webview 内核不支持 css 十六进制颜色附加透明度的写法?

2020-03-18 22:32:36 +08:00
 libasten

最近踩了一个坑,用一个 div 的背景色在页面上表示一个不含文字的按钮,顺手把背景色设定为:#6666666,想着最末两位 66 表示透明度,这在 PC 上是正常的。 然后有人跟我反映这个按钮在安卓手机上看不到,非常奇怪,在 PC 上 chrome 调试时候设定成手机还是正常的,只是到安卓上就不显示,苹果还正常。 测了好大一晚上,才判定原来是这样写 8 位十六进制数的方式的问题,差了一会,没有找到官方说法,不知道我推测的对不对呀? 看来一会写透明度时候还是要用 rgba 或者 opacity 的方式。

2163 次点击
所在节点    CSS
3 条回复
yyfearth
2020-03-19 00:21:16 +08:00
用之前要查一下兼容性呀
这种比较新的特性 你换老一点版本的 Chrome 也不支持 老点的 iOS 都比较明显了 Android 更不用说 要是碰到哪个从来不更新的 webview 的 chromium view 版本可以老到你下巴掉下来

当然最稳的办法是用 postcss 这些预处理工具自动把 css 转到兼容的版本

JS 也有一样的问题 用 babel 处理即可
libasten
2020-03-19 06:01:00 +08:00
@yyfearth 毕竟不是专业前端,平时写东西都是网上抄抄…
dorentus
2020-03-19 06:39:16 +08:00

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/654060

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX