1.前端在写项目的时候要做到自适应屏幕宽比,在字体用到绝对尺寸时,字体不会随窗口变化而变化。用到rem,em时感觉又不方便。利用css的calc属性,这个方法比较简单。
方法:
这里的vw是视窗宽度,15是15px绝对尺寸,2240就是自己屏幕的宽度,可以按照需求写。calc:是一个css自带的计算方法,可以自动计算后返回px单位的值。
font-size:calc( 100vw * 20 / 2240);
我们的需求是文字大小是25px,而我们的屏幕是2240*1400,这时就可以将设置25px。
font-size:calc( 100vw * 25 / 2240);
这个只会根据屏幕宽度来进行字体的放大缩小,将vw换成vh是根据屏幕高度来进行缩放。