随着浏览器变小，是否可以调整文本大小，css答案

【问题标题】：is it possible to have text resize as the browser gets smaller, css随着浏览器变小，是否可以调整文本大小，css
【发布时间】：2011-08-20 03:18:44
【问题描述】：

对于基于液体的设计，有没有办法在浏览器变小时按百分比调整文本大小。

图像 div 等，所有重新缩放，但文本百分比缩放是不可能的！以百分比设置它只会更改该文本的统一 em 设置 - 在每个浏览器宽度相同。

【问题讨论】：

前段时间我在这里（stackoverflow.com/questions/5358183）发现了一个类似的问题，其中有一个工作示例。
当心，似乎没有 min-font-size 等效项 (at least yet)。
检查这个答案可能对你有帮助：stackoverflow.com/a/61892360/6293856

标签： css

【解决方案1】：

除了在特定时间间隔使用媒体查询，我不太确定。

我会怎么做：

.content {
    font-size:16px;
}

@media all and (max-width: 800px) {
    .content {font-size:14px;}
}

@media all and (max-width: 600px) {
    .content {font-size:12px;}
}

@media all and (max-width: 400px) {
    .content {font-size:10px;}
}

没有 javascript，纯 CSS。

【讨论】：

如果您已经用自己的代码替换了媒体查询中的内容，那么它应该可以工作。发生了什么，什么都没有？
谢谢，但是我希望 div 等的所有 em 宽度和高度也调整大小！
与 ems 一起使用！但必须写@media screen and (min-width: 85em) and (max-width: 100em) { body { font-size:.8em;} } @media screen and (min-width: 100em) and (max-宽度：110em) { body { font-size:.9em;} }

【解决方案2】：

我相信这正是您想要的：

http://css-tricks.com/viewport-sized-typography/

【讨论】：

【解决方案3】：

是的，可以通过使用 JavaScript 代码处理 onResize 事件来调整文本大小。不过，onResize 存在很多问题，包括 debouncing，这可能会变得很复杂。

我知道这不是您的问题的一部分，但我想知道调整文本大小是否是个好主意。毕竟，用户已经告诉浏览器他/她对当前大小的文本感到满意。覆盖用户的清单偏好真的那么友好吗？

【讨论】：

只是这样当浏览器很小的时候应该可以保留基本布局看看link