小程序
小游戏
企业微信
微信支付
扫描小程序码分享
代码
如何适配深色模式?
2 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
设置 mask-class 的坑点 是,它是一个 渐变背景。你需要使用linear-gradient 来定义css渐变背景,而且渐变背景的本质是一个 background-image,于是当你发现渐变背景在鬼畜重复的时候,需要将background-repeat设置为 no-repeat,而当你设置了 no-repeat以后,发现渐变背景只能遮盖picker-view的一半大小的时候background-size,使这个 size 匹配你的 picker view大小,这里要加上 !important,不然不能覆盖默认值。
这里是一个 class:
.picker-mask {
max-width: auto;
background: rgb(0,240,244);
background: linear-gradient(0deg, rgba(0,240,244,1) 0%,
rgba(121,255,250,0) 45%,
rgba(121,255,250,0) 55%,
rgba(163,255,118,1) 100%);
background-size: 750px 300px !important;
background-position: center center;
background-repeat: no-repeat;
z-index: 9;
}
或者直接看 下面这个 代码片段。
https://developers.weixin.qq.com/s/B0VrcbmD72ni
ps: 确实有点坑,基本就靠猜,几百次瞎猜以后,侥幸被我猜中。
在猜中之前,我采用了另外一种方法
给 mask-class 设置为 background: none !important; 让他彻底滚蛋。
给 picker-view 定义一个 class 加上 :before :after,然后自己定义 渐变背景,其中:after 用 transform 的 rotateY 倒过来, 并且要把 pointer-event: none 来确保这个 伪类层不会被点击。(当然,并没有在多种机型上测试过,鬼知道会不会有什么坑。)
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
mask-style未使用过
建议使用:mask-class
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
设置 mask-class 的坑点 是,它是一个 渐变背景。你需要使用linear-gradient 来定义css渐变背景,而且渐变背景的本质是一个 background-image,于是当你发现渐变背景在鬼畜重复的时候,需要将background-repeat设置为 no-repeat,而当你设置了 no-repeat以后,发现渐变背景只能遮盖picker-view的一半大小的时候background-size,使这个 size 匹配你的 picker view大小,这里要加上 !important,不然不能覆盖默认值。
这里是一个 class:
.picker-mask {
max-width: auto;
background: rgb(0,240,244);
background: linear-gradient(0deg, rgba(0,240,244,1) 0%,
rgba(121,255,250,0) 45%,
rgba(121,255,250,0) 55%,
rgba(163,255,118,1) 100%);
background-size: 750px 300px !important;
background-position: center center;
background-repeat: no-repeat;
z-index: 9;
}
或者直接看 下面这个 代码片段。
https://developers.weixin.qq.com/s/B0VrcbmD72ni
ps: 确实有点坑,基本就靠猜,几百次瞎猜以后,侥幸被我猜中。
在猜中之前,我采用了另外一种方法
给 mask-class 设置为 background: none !important; 让他彻底滚蛋。
给 picker-view 定义一个 class 加上 :before :after,然后自己定义 渐变背景,其中:after 用 transform 的 rotateY 倒过来, 并且要把 pointer-event: none 来确保这个 伪类层不会被点击。(当然,并没有在多种机型上测试过,鬼知道会不会有什么坑。)
mask-style未使用过
建议使用:mask-class