Day14移动端布局

1.rem是什么?

rem(font size of the root element)是指相对于根元素的字体大小的单位。

2.为什么web app要使用rem?

实现强大的屏幕适配布局(淘宝,腾讯,网易等网站都是rem布局适配)rem能等比例适配所有屏幕,根据变化html的字体大小来控制rem的大小。

3 vw vh

vw:viewpoint width,视窗宽度,1vw等于视窗宽度的1%。

vh:viewpoint height,视窗高度,1vh等于视窗高度的1%。

vmin:vw和vh中较小的那个。

vmax:vw和vh中较大的那个。

vw, vh, vmin, vmax:IE9+局部支持,chrome/firefox/safari/opera支持,iOS safari 8+支持,Android browser4.4+支持chrome for android39支持vw vh

4.Rem配合VW做等比缩放布局

1.rem是指相对于根元素的字体大小的单位。

2.根元素如果根元素是相对设备尺寸自动变换。

3.VW视窗宽度,1vw等于视窗宽度的1%。

4.VW转换成PX赋值给font-size例:设备的分辨率为640*1136,逻辑像素为320*568 1VW=3.2pxFont-size:100px;转换成VW font-size:31.25vw;1rem=31.25vw可一起结合写等比例缩放布局。

5.移动端头尾固定布局的四种方法

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值