写完媒体查询的样式,有时候会发现并没有出现想要的自适应效果
1. 首先检查html页head标签内有没有以下代码
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
width - viewport的宽度
height - viewport的高度
initial-scale - 初始的缩放比例
minimum-scale - 允许用户缩放到的最小比例
maximum-scale - 允许用户缩放到的最大比例
user-scalable - 用户是否可以手动缩放
添加这个标签还能够防止移动端出现横向滚动条
2. 如果还不管用,试试清除浏览器缓存或调整meta标签的位置,放在最上面试试
今天遇到这个问题,之前都是可以的,突然失效,最后试了这几种方法,调整了meta标签的位置才终于好了。