浏览器窗口调整尺寸时怎样让字体尺寸联动？

Question

有css的解决方案吗？

Answer 1

JavaScript solution:

window.addEventListener('resize', function(){
    var ratio = Math.sqrt((window.innerWidth / 1024) * (window.innerHeight / 768))
    document.body.style.fontSize = (16 * ratio) + 'px';
});

Answer 2

纯css解决方法的话就是media queries了。不过我觉得这种不灵活，因为是断点而不是完全跟随窗口变化。
最好的解决办法是利用js监听resize事件然后更改html元素的font-size，然后其他子元素字体单位用REM

Answer 3

必须JS去监听resize事件