iCore.Space

在人间打工的下凡文员

一行代码实现输入控件适配深色主题

最近了解到,通过CSS代码,就可以实现根据系统明暗主题,自动切换网页的明暗主题。还意外了解到,只需要一行代码,就能将所有输入控件,自动适配深色主题。

上代码之前,先来看看效果。截图中的所有输入控件,比如Input、Textarea和Select Box等,在设备应用深色主题时,都自动显示了黑色背景,并且输入文本会自动显示为白色,与手动指定的深色主题,几乎是完美匹配。

iphone_14_pro_v2
iphone_14_pro_v2

真的只需要一行代码,别的什么都不需要。将这行meta声明,添加到网页HTML的head部分,切换设备到深色主题,刷新网页,效果立马可得。

<meta name="color-scheme" content="light dark">

艾玛,是谁发明的这些简单又强大的东西,太好了!

Comments

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注