CSS判断手机暗黑模式

手机有个功能到了晚上会自动变成深色也就是暗黑模式.这种情况下网页会自动变颜色.如果想自由控制暗黑模式下的html样式的话,可以用如下方式:

css 复制代码
        @media (prefers-color-scheme:  dark) {
            /*html, body {*/
                /*filter: invert(1) hue-rotate(180deg);*/
            /*}*/
            .maill{
                margin-left: 0;
                margin-right: 0;
                margin-top: 0px;
                margin-bottom: 0px;
                width: 100%;
                max-width: 100%;
                background: rgb(255,255,255)!important;

                padding: 0px;
                padding-bottom: 20px;
            }
            /*img, video,audio{*/
            /*@include hover-change(#4B4B4B,white);*/
            /*}*/
        }

这就只会在暗黑模式的时候才生效!

相关推荐
HarryHY几秒前
Vue 自动导入函数和变量插件 unplugin-auto-import
前端·javascript·vue.js
Monly213 分钟前
Vue:Form正则校验
前端·javascript·vue.js
码上奶茶9 分钟前
HTML 标签
前端·html·标签·路径·超链接·双标签·单标签
全宝17 分钟前
🔢前端解决浮点数运算精度丢失的问题
前端·javascript
江城开朗的豌豆24 分钟前
JavaScript篇:偷懒也有理!事件代理让我少写一半代码
前端·javascript·面试
云浪39 分钟前
掌握 CSS 倾斜函数
前端·css
ai产品老杨1 小时前
实现自动化管理、智能控制、运行服务的智慧能源开源了。
前端·javascript·vue.js·前端框架·ecmascript
唐诗1 小时前
优化 Nextjs 开发的个人博客首页,秒开!
前端·next.js
飞川撸码1 小时前
web vue 项目 Docker化部署
前端·vue.js·docker·运维开发
默默无闻的白夜1 小时前
【Vue】初学Vue(setup函数,数据响应式, 脚手架 )
前端·javascript·vue.js