我这边的需求是微信小程序嵌套web页面,web页面有多端在用,我需要判断是否是移动端做样式的兼容。
比如下面是判断是移动端的media query,我会设置不同的样式。
@media only screen and (hover: none) and (pointer: coarse) {
/* 移动端*/
width: 100%;
}
但是微信小程序不符合这个media query,被判断为pc端,导致样式错乱。
而判断微信小程序环境,官方给的都是js的方式。
我当然可以通过js判断然后给不同的样式,但是因为移动端兼容逻辑都写完了,我不想改动太多,最简单的方式就是js判断是否微信小程序环境,然后结合media query,比如
@media only screen and (hover: none) and (pointer: coarse) or 微信小程序 {
/* 移动端*/
width: 100%;
}
能不能搞?怎么搞?
CSS: