常见数值单位:
①px (pixel) 像素px是相对于显示器分辨率
②em: 相当于当前对象内的font-size,如未设置,则相当于浏览器的默认字体尺寸
em的值并不是固定的,它会继承父级元素的字体大小。
③rem: 相当于根元素(html)的字体大小的单位,根据htm l设定的font-size来换算
④vh(viewport height): 相当于视图窗口的高度和宽度
假设浏览器高度为200px,那么1vh等于2px (200px/100)
⑤vw(viewport width): 相当于视图窗口的高度和宽度
假设浏览器宽度为200px,那么1vw等于2px (200px/100)
⑥rpx(responsive pixel): 是微信对于rem的一种应用判定,可根据屏幕宽度进行自适应,每种手机型号对应不一样的标准判定
Tips:
- em和rem区别:
rem是相对于根元素的字体大小,em是相对于其父元素的字体大小
- 相对于父元素
对于普通定位元素即是我们理解的父元素
对于position:absolute的元素即为已定位的父元素
对于position:fixed的元素即为相对于viewport,根据浏览器窗口来决定字体大小
原创文章,作者:bd101bd101,如若转载,请注明出处:https://blog.ytso.com/tech/pnotes/267033.html