html - 将文本保持在一行并缩放字体

标签 html css

希望这可以仅用 CSS 而不是 javascript+css 来实现。

我想要实现的是说我有一个固定宽度为 100px 的容器。它不能小于或大于 100 像素。我在此容器中有文本,我希望始终位于一行(现在换行),如果文本太长,它将缩放字体以适合容器。

这可能吗?我尝试设置宽度并设置 font-size: 100% 和空白:nowrap。但它不太有效。字体缩放但不足以留在框中。使用 Overflow:hidden 不起作用,因为它会切断我不想要的文本。

最佳答案

我知道这已经晚了 4 年,(这是为了以后搜索这个问题的人,因为这是我在谷歌上的第一名)但我能够用 {font-size 做一些小工作:_vw}。我不确定这是不是当时的情况。但就我个人而言,我设置了文本的 vw(经过一些尝试和错误)以找到我需要的大小并坚持下去。现在它可以完美扩展。我想如果文本变得太小,您可能会遇到大屏幕和移动设备的问题。但只需要一行 CSS,它就完全适合我了。

关于html - 将文本保持在一行并缩放字体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16361606/

相关文章:

html - 如何将 css 类用于 Angular Material 中的文本颜色?

javascript - 如何从 fiddle 组合 html、js 和 css

javascript - 如何将 VBScript 字符串传递为我的 HTML 输入框中的默认值?

html - 如何为 div 接受 D&D,但传播点击?

python - BeautifulSoup 在使用 findAll(text =' ') 后返回下一个 sibling

Javascript 复选框和随机列表输出文本而不是变量

html - 高度 :100%; doesn't show up

html - 去掉外边框间距,保留内边框间距,确保中间div保持一定大小

html - 如何在 bootstrap 中使用 css3 中的响应式背景图片

html - 将ul放在左下角