Disqus iframe 透明度不适用于 Chrome 87
Disqus iframe transparency won't work on Chrome 87
升级到 Chrome87 后,我注意到 Disuq 的背景透明度不适用于深色主题 - 背景和文字都是白色的,因此讨论无法阅读。
由于文本设置为白色,这意味着 Disqus 可以识别深色主题,但背景的透明度将不起作用。
我可以看到 allowtransparency
属性已设置:
这在旧版本的 Chrome 和 Firefox 上运行良好:
在其他网站上,我看到disqus对Chrome87的深色主题没有任何问题。
有人遇到过这样的问题吗?任何人都知道如何解决这个问题?
不幸的是,我不能指望 Disqus 支持,因为他们不回复电子邮件,而且在他们的论坛上,我关于这个问题的 post 被无缘无故地识别为垃圾邮件。
编辑:
我现在发现这个元标记导致了这个问题:<meta name="color-scheme" content="dark light">
不删除这个meta标签能解决这个问题吗?
好的...我找到了解决方案。
此元标记导致了问题:<meta name="color-scheme" content="dark light">
我删除了它,而是添加了 CSS 代码,如下所示:
:root {
color-scheme: light dark;
}
iframe {
color-scheme: light;
}
正确的解决方案是将颜色方案支持 css 片段添加到父文档和 iframe 文档。这是因为 css 片段告诉浏览器,已为应用 css 的文档实现亮模式和暗模式。它没有说明支持嵌入在该文档内的 iframe 中的文档。
/* Apply this css fragment to both parent.html and iframe.html */
:root {
color-scheme: light dark;
}
升级到 Chrome87 后,我注意到 Disuq 的背景透明度不适用于深色主题 - 背景和文字都是白色的,因此讨论无法阅读。
由于文本设置为白色,这意味着 Disqus 可以识别深色主题,但背景的透明度将不起作用。
我可以看到 allowtransparency
属性已设置:
这在旧版本的 Chrome 和 Firefox 上运行良好:
在其他网站上,我看到disqus对Chrome87的深色主题没有任何问题。
有人遇到过这样的问题吗?任何人都知道如何解决这个问题? 不幸的是,我不能指望 Disqus 支持,因为他们不回复电子邮件,而且在他们的论坛上,我关于这个问题的 post 被无缘无故地识别为垃圾邮件。
编辑:
我现在发现这个元标记导致了这个问题:<meta name="color-scheme" content="dark light">
不删除这个meta标签能解决这个问题吗?
好的...我找到了解决方案。
此元标记导致了问题:<meta name="color-scheme" content="dark light">
我删除了它,而是添加了 CSS 代码,如下所示:
:root {
color-scheme: light dark;
}
iframe {
color-scheme: light;
}
正确的解决方案是将颜色方案支持 css 片段添加到父文档和 iframe 文档。这是因为 css 片段告诉浏览器,已为应用 css 的文档实现亮模式和暗模式。它没有说明支持嵌入在该文档内的 iframe 中的文档。
/* Apply this css fragment to both parent.html and iframe.html */
:root {
color-scheme: light dark;
}