手记

常见的单位

常见的单位有px,em,rem,vh,vw,%

1. px
px是pixel的意思(像素)。图像是由一个个像素组成的,每个点是一个像素。比如1922*1080表示横向1922个像素点,纵向1080个像素点
2. em
主要用于font-size,参考最近的父元素的font-size。1em = 1倍的父元素的font-size。
所以在一个网页中会出现1em代表的大小不一样的情况。
3. rem
与em不同的地方是:rem参照的是html元素的font-size。不会1rem大小不一样。css3新增。
网页默认的字体大小是16px。默认1rem = 16px
4. vh
vh是viewport height的缩写,CSS3新增的,参照视口高度,1vh = 1%的视口高度
5. vw
vw是viewport width的缩写,参照视口宽度,1vw = 1%的视口宽度
vh和vw可以用在元素大小随视口变化上。一般用于长度单位
6. %
百分用到的地方很广泛,比如长度,字号(相对于最近的父元素的字号),位移等
7. vm
vm相对于宽高中较小的那个,1vm = 1%较小的宽高

Chrome默认的字体大小为16px
16px*62.5% = 10px
1rem = 10px
为了方便计算,所有可以将默认font-size设为62.5%
Chrome最小字号为12px(mac下测试),在win下测试为9.6px



作者:椰果粒
链接:https://www.jianshu.com/p/30cba323b142


0人推荐
随时随地看视频
慕课网APP