rem和em

一，什么是rem

1.rem是css3引入的相对单位，一般用于基于宽度的等比缩放，

2.1rem的大小取决的html根元素的字体大小。

3.rem可以想象成将屏幕宽度分成了几等份

二，基于rem的自适应布局

1.假设有一个1920*1080的设计稿，

2.我们先将html元素字体设置为100px，那么1rem=100px，屏幕被分成19.2等分

3.当页面加载时我们要获取窗口的大小，document.documentElement.clientWidth

4.为了在不同大小的窗口比例相同，宽度要被分成相同等份的rem,因此我们可以得出公式：1920/100=document.documentElement/font-size，即font-size=（document.documentElement.clientWidth*100）/1920

5.将根字体的大小设置成该font-size大小即可。

$(function(){
	let doc  = document.documentElement
	window.onresize=function(){
		let font-size = (doc.clientWidth*100)/1920
		doc.style.fontSize = font-size
	}
})