javascript - 如何在调整大小时更改字体大小以适合其父框？

Question

这是我所做的链接
一些关于小分辨率的文本从父框出来并被剪裁。如何解决？
使用 jQuery 会更好，但我不介意 JavaScript。
更新
我想要做的是，当页面调整大小时如何使文本适合其父框？

Answer 1

您可以使用 css 定位屏幕尺寸

@media screen and (min-width: 500px) and (max-width: 700px) {
body{
    font-size: x-small;
    }
}

@media screen and (min-width: 701px) and (max-width: 2000px) {
body{
    font-size: medium;
    }

}   

Answer 2

这可以通过使用 javascript 或 jquery 来完成。你可以调用jQuery的resize函数

$(window).resize(function() {
  if($(this).height() < 640) {
      $(body).css("font-size","10pt");
  }
});

通过使用这种方式，您可以自定义您的逻辑....

Answer 3

您可以为此使用fittext.js。这些其他解决方案将起作用。但是，如果您更改浏览器大小，它可能会开始变得非常混乱。