媒体查询样式失效的解决办法

写完媒体查询的样式，有时候会发现并没有出现想要的自适应效果

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标签的位置才终于好了。