响应字体大小nowrap

Question

我想在屏幕上显示一行文字，以便：

1. Width: 100％
2. Fonts-size最大可能基于浏览器宽度
3. 仅限一行（nowrap）
4. 鉴于font-family

我的想法是启动一个隐藏的div和随机font-size，然后运行 jQuery 到“暴力”来增加或减少font-size以便它宽度接近浏览器宽度。

有最佳方法吗？如果我能看到一些例子，那太棒了。感谢。

Answer 1

这是解决方案

http://simplefocus.com/flowtype/

$('body').flowtype({
   minimum : 500,
   maximum : 1200
});

下载https://github.com/simplefocus/FlowType.JS

最好的网络排版：基于元素宽度的字体大小和行高。

Answer 2

我会弄清楚文字的宽度与字体高度的比例，然后做类似的事情

var w = [parentElement].clientWidth; [textElement].style.fontSize = w*ratio;