1,vw,vh,vmin,vmax是由视窗Viewport大小来决定的,单位1,代表1%,是一种相对单位,只要是为响应式适配视窗的一种解决方案;
vw:view width(视窗宽度)的百分比,1vw代表视窗宽度的1%;
vh:view height(视窗高度)的百分比,1vh代表视窗高度的1%;
vmin:当前视窗宽度vw和视窗高度vh中较小的一个值;
vmax:当前视窗宽度vw和视窗高度vh中较大的一个值;
2,与百分比的区别:
(1)%是相对于父元素的大小设定的,而vw,vh是由视窗大小决定的。
(2)vw,vh优势在于能够直接获取高度,而%则在没有设定body的高度情况下,是无法正确获取可视区域的高度的,所以css3加入新单位是方便开发者的选择。
3,vmin,vmax的用处:
做移动页面开发时,如果使用vw,vh设置字体大小(例如10vw),在竖屏和横屏状态下显示字体大小是不一致的,而vmin,vmax是当前vw和vh中,较小值和较大值,这里就可以使用vmin和vmax,使得文字在横竖屏下面显示一致。
4,浏览器兼容性:
5,应用:
比如,弹出框大小随内容自适应;显示大图石限制其最大尺寸;实现Word文档页面效果(使用vh单位,一屏正好一页,改变浏览器窗口大小,页面大小随之变化)等。
【完】
新年flag2——每天走8000步,一个月走8000*30=24W步,一万步大约7KM,那么24*7=168公里,小米手环/手机打卡。