A.使用CSS
CSS Media Feature Preferreds-color-scheme允许您在浏览器中检测用户是否根据操作系统配置选择 浅色还是深色主题。CSS语法如下,例如,如果用户更喜欢深色模式,则应该能够使用以下CSS设置深色背景:@media (prefers-color-scheme: dark) {
body {
background: black;
}
}浅色调这样设置:@media (prefers-color-scheme: light) {
body {
background: white;
}
}B.使用JavaScript
如果您希望根据用户的偏好运行一些JavaScript代码,则可以验证此条件,以验证浏览器是否支持matchMedia并验证配色方案的条件是否暗匹配:const userPrefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
const userPrefersLight = window.matchMedia && window.matchMedia('(prefers-color-scheme: light)').matches;
if(userPrefersDark){
console.log("User prefers a dark interface");
} 网友回复
gpt-image2能直接将图片转成分层透明的psd设计文件?
claude code、codex、gemini cli如何切换国内大模型使用?
蒸馏最强ai大模型是中小ai模型低成本升级的最好通道?
arena.ai上为啥没有最新的claude4.7及gpt5.5呢?
ai大模型公司为啥开始大量招聘文科生了?
cloudflared如何在低版本centos6或7上安装?
bfwsoa框架如何开启异步缓存与异步任务模式?
selenium如何获取网页js加载渲染后的真实dom结构?
go编写的Eino与python编写的langchain如何选择?
LangChain如何编写多个agent协同工作的代码?


