Jquery字体大小调整为div高度？

Question

有没有办法将字体大小调整为div框或？的高度。我知道有很多方法可以将字体大小调整为父元素的宽度，但我无法找到将字体大小调整到高度的东西。

我在表格中有几行：

 <table>
 <tr>
 <td> Line 1 </td>
 </tr>
 <tr>
 <td> Line 2 </td>
 </tr>
 <tr>
 <td> Line 3 </td>
 </tr>
 </table>

表格的高度为视口的100％。所以每个td的高度为33.33％。这意味着每行的字体高度应该有33.3％的视口！不知道怎么做到这一点！我很高兴每个有用的链接或答案！谢谢！

Answer 1

jQuery＆＃39; s height()会为你工作吗？

var height = $('td').height();
$('td').each(function() {
  $(this).css({'font-size': height + 'px', 'line-height': height + 'px'});
});

Answer 2

如果您不需要support older browsers，则可以使用new viewport-unit in CSS3：

html, body {
    height: 100%;
    font-size: 100vh;
}
table {
    height: 100%;
}
td {
    font-size: 33.3%;
}

http://jsfiddle.net/ZaJ8w/