能否将文本大小调整以适应固定大小的div？

Question

5

我认为这是一个相当自然的用例，但是我没有找到任何相关资料：

假设我有一个固定宽度的 div，里面动态填充了一些数字。有什么最好的方法可以确保具有更多位数的数字采用较小的字体大小，以便它们能够完美地适应该固定宽度？是否有一些 CSS 属性可以解决这个问题，或者我必须使用 JavaScript 来处理?

- int3

1

自然的使用情况是要么使用滚动条，要么使用溢出进行剪辑。 - Murali VP

如果您正在显示单个数字，则这些解决方案都不是很令人满意。 - int3

2个回答

3

Css不能实现这个功能，但你可以尝试使用这些脚本：http://www.zachleat.com/web/fittext-and-bigtext/。

- kaore

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- timmfin · Accepted Answer

没有一种CSS属性可以根据固定容器自动调整字体大小。您需要使用JavaScript。

您可以将每个数字放在一个中，并循环检查每个的宽度。如果宽度大于固定宽度，请将字体大小降低，然后再次检查宽度。不断降低字体大小，直到的宽度小于固定宽度。

为了防止闪烁，您应该在固定

可见但位于页面之外（例如“position: absolute; left: -5000px;”）时执行此循环检查。