2015年以前,在css里实现网页字体大小根据窗口大小变化,一定要用到javascript、jquery,那个蛋疼不是一般人能受得了的。
今天我发现了一个新技术——使用font-size的最新的自适应单位(vw、vh、vmin、vmax)就可以了!
- 1vw = 当前视图窗口(viewport)1%的宽度
- 1vh = 当前视图窗口(viewport)1%的高度
- 1vmin = 1vw 或 1vh, 取决于哪个更小一点
- 1vmax = 1vw 或 1vh, 取决于哪个更大一点
注意:这些尺寸单位目前(2017.3)在手机端上是不兼容的!
参考: