html – CSS opacity属性在Chrome 54 for Mac上显得异常暗淡

html – CSS opacity属性在Chrome 54 for Mac上显得异常暗淡,第1张

概述<视频> Mac上最新版Chrome(54)的CSS opacity属性标签比其他浏览器(包括 Windows上的Chrome 54和Mac上的Chrome 53)更暗淡.当不透明度设置为如0.2的低值时,这是非常明显的.我在多个系统上见过这个. 在Mac上的最新版Chrome(目前为54)上运行此代码,然后在另一台浏览器上运行此代码以查看差异.如何更改此代码以使Chrome for Mac上的视 @H_301_1@ <视频> Mac上最新版Chrome(54)的CSS opacity属性标签比其他浏览器(包括 Windows上的Chrome 54和Mac上的Chrome 53)更暗淡.当不透明度设置为如0.2的低值时,这是非常明显的.我在多个系统上见过这个.

在Mac上的最新版Chrome(目前为54)上运行此代码,然后在另一台浏览器上运行此代码以查看差异.如何更改此代码以使Chrome for Mac上的视频不透明度与其他浏览器一致?

<!DOCTYPE HTML><HTML><head><Title>VIDeo</Title><style type="text/CSS">vIDeo {    opacity: 0.2;}</style></head><body><vIDeo src="https://demos.churchthemes.com/maranatha/wp-content/uploads/sites/8/2016/10/lighthouse-loop.mp4" autoplay loop></vIDeo></body></HTML>

https://jsfiddle.net/68q91qwc/4/

Screenshot Comparison – 这显示了差异.

感谢您查看我的问题.

解决方法 我也遇到了这个问题,有人找到了解决方案吗?

编辑:

为此我已经实现了临时修复,首先使用以下命令将.mac或.pc类应用于正文:

if (navigator.userAgent.indexOf('Mac OS X') != -1) {  $("body").addClass("mac");} else {  $("body").addClass("pc");}

然后使用仅限Chrome的媒体查询来定位它.

@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {    #home.mac selector {        opacity: 0.3;    }}
总结

以上是内存溢出为你收集整理的html – CSS opacity属性在Chrome 54 for Mac上显得异常暗淡全部内容,希望文章能够帮你解决html – CSS opacity属性在Chrome 54 for Mac上显得异常暗淡所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/1053154.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-25
下一篇 2022-05-25

发表评论

登录后才能评论

评论列表(0条)

保存