Html 在暗模式下禁用时，如何防止只读输入文本字段消失？

我正试图创建一个只读文本字段，但每当我将其设置为

readonly

，它就会在灯光模式下变灰。在暗模式下，禁用时，其背景色与字体颜色一起变为完全黑色，使字段及其内容不可见

当我尝试使用CSS设置样式时

输入：只读：禁用{
背景：#a0a1a7；
不透明度：0.7；
}

在暗模式和亮模式下，禁用时，它与其他文本字段的颜色不同

我尝试将

value=“readonly”readonly

添加到

中，但成功率很低。这就是它看起来的样子：

我不希望将其设置为禁用，因为我仍然需要在文本字段中传递数据。你知道我能为此做些什么吗

---

值得一提的是，我正在使用Google Chrome，亮/暗模式设置由系统首选项设置。

您可以使用

例如，检查

或者做类似的事情

@媒体（首选颜色方案：深色）{
输入：只读{
背景：whie；
}
}

您是否尝试添加

！重要信息

是否显示样式中的背景<代码>背景：#a0a1a7！重要的。浏览器默认设置可能会导致出现一些不需要的内容浏览器不会基于亮/暗模式更改元素的外观。是什么改变了你的元素风格？工作起来很有魅力！非常感谢。