问题描述
我在页面折叠下面有一些文本，其不透明度设置为0.3，直到用户将其滚动到视图中为止。然后将其设置为不透明度1。
在Google Chrome上使用Lighthouse检查我的网站时，在可访问性部分下出现此错误：Low-contrast text is difficult or impossible for many users to read.是否可以解决此问题？
解决方法
前言：我假设您在整个答案中都将不透明度从0.3转换为1。如果您不对不透明度进行动画处理，则只需将其完全删除即可，它会增加页面的重量，复杂性和潜在的问题，毫无益处。
灯塔
没有办法修复它并保持它的状态。
可能选项是在屏幕外时完全隐藏文本，然后在进入视口的第二秒将不透明度设置为0.3，然后将其淡入（假设您将其淡入，您没有指定要这样做，但是为什么您根本不愿意更改不透明度？）。
这可能会诱使灯塔正确处理（可能是由于它决定了在测试过程中何时查看页面的其余内容，但仍可能会引起问题）。
要检查的另一件事是，该项目是否也正在使用transform或类似的东西移动，它在transition期间没有与另一个项目重叠，因为这可能会导致颜色对比问题报告。
归根结底，这是一种取悦测试设备的解决方法，所以我无论如何都不会推荐它，而只是一个建议。 只要您确信一旦消失就具有足够高的对比度，那就可以了，您可以忽略此错误。
可访问性
从可访问性的角度来看，如果prefers-reduced-motion媒体查询处于活动状态，请确保不播放动画。
还要确保，如果该脚本具有任何JavaScript触发器（即，它不是纯CSS），则在当出现JavaScript失败或没有JavaScript浏览的用户时，默认默认不透明度为1
测试
灯塔在幕后使用Axe，因此要完全加载页面并使其文本完全“淡入”，然后运行我链接的chrome扩展名。如果通过了，那么您应该没事（不过，自动测试再也不是完美的选择了。）