放大文本大小以适应容器
放大文本大小以适应容器
提问于 2012-01-25 01:09:34
使用CSS，特别是不使用onload javascript，是否可以做到这一点：
你有一个150px宽，100px高的单元格。它包含一个文本，例如：$20,00或其任何变体。
您希望它完全适合容器的大小。
我可以用javascript来做这件事，调整文本的大小，直到没有填充/边距的容器达到单元格的宽度和/或高度。或者将其包含在将overflow设置为auto的内容中，并查看何时溢出或其他内容。
它能用纯CSS完成吗？
考虑到字体也不是固定大小的字体。如果您愿意，可以使用Arial。
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-12-22 02:40:02
我做过的一件事并不完美，但在某些情况下可以完成工作，那就是对小于X像素的屏幕尺寸使用@media规则，将字体大小设置为更小或更大。
h2{
font-size:25px
}
@media screen and (max-width: 850px){/* for screens smaller then 850px, set the font size smaller */
h2{
font-size:19px;
}
}当然，只有在文本容器的大小以某种方式基于窗口大小的情况下，这才能起作用。
Stack Overflow用户
发布于 2012-08-24 04:22:55
看看这个：http://css-tricks.com/viewport-sized-typography/
不幸的是，这只适用于Chrome 20+和IE 10+，所以现在你只能坚持使用a js solution了……
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/8990999
复制相关文章
相似问题