专题课程
meta标签
Meta标签有很多相应的属性，对于很多在做移动端的开发者而言有不少的技巧需要掌握的，我们先看一段代码：
我们对代码的解释是：
width：viewport（设备）的宽度
height：viewport（设备）的高度
initial-scale：初始的缩放比例
minimum-scale：允许用户缩放到的最小比例
maximum-scale：允许用户缩放到的最大比例
user-scalable：用户是否可以手动缩放
字体大小的设置
除了以上设置外，再用js设置一下html的字体大小，就OK了，我们看看代码如下：
var a = document.documentElement ? document.documentElement.clientWidth : document.body.clientWidth;
if (a > 640) {
a = 640
}
document.documentElement.
style.fontSize
= a * 1 / 16 + "px";
_htmlFontSize = a * 1 / 16;
我们需要注意的是：如果你的设计稿的宽度是640px，那就根据640来计算，如果是其他，就改成其他，如这里，按照640px来计算，得出html的字体大小为40px，则网页中任何元素的大小都必须除以40，得到的值的单位用rem，这样整个网页会根据不同移动设备屏幕大小来达到自适应。是不是很方便呢？
小结：这样的设置唯一的缺点就是，每当遇到网速比较慢的时候，会有延迟的效果，影响用户的使用体验，在微信上的效果就会显得特别明显。这是我们在使用微信中可以体验到的。
我们还需要注意的是，在设置border的时候，还是用px像素作为单位。
收藏(0)
赞 
粤公网安备44010602001432号