javascript - td 中的文本可以随 td 一起调整大小吗？ (是它高度的百分比？)

Question

我有一个 100% 屏幕的表格，里面有 3x3 = 9 个单元格，每个单元格 33%。到目前为止，一切都很好。它是一种干净、可扩展的井字游戏。

问题是 TD 中的文本没有按比例缩放。

有什么方法可以说“我希望文本大小为 TD 高度的 30%”？或者什么

PS:我试过font-size:50%，但是不行。这意味着父字体大小的 50%，这是一些以像素为单位的固定值。所以它不是动态的。

Answer 1

因为我已经在评论中为您提供了演示，但我读到您想要 font-size基于 height每个 td即30%的 td所以你无法使用纯 CSS 来做到这一点，你将不得不使用 Javascript 或 jQuery 来实现......

$('table tr td').each(function() {
    $(this).css('font-size', $(this).height()*0.3 + 'px');
});

Demo