如何在移动设备上更改文本的大小？答案

【问题标题】：How can I change the size of my text on a mobile device?如何在移动设备上更改文本的大小？
【发布时间】：2015-03-16 19:44:23
【问题描述】：

我知道如何使用 (font-size) 属性，但我只希望移动设备上的字母在达到一定数量时变小.....

当字母达到 40 个字符时，我希望缩小字母以适应移动浏览器

这个可以吗？

【问题讨论】：

是的，可以做到。除了使用用户代理字符串来检测用户如何访问您的网站的更可疑的方法之外，您还可以使用媒体查询将某些 CSS 样式仅应用于某些屏幕尺寸。或者，您可以简单地使用 em 或 rem 而不是 px 之类的响应值来实现与您网站的其余部分相关的适当字体大小。
@TylerH - 我希望文本只有在达到一定长度时才会调整

【解决方案1】：

您可以使用 jquery 来计算某个标签内的字符数。例如在<p>这样的：

var XX = 40;

$('p').filter(function() {
    return $(this).text().length > XX;
}).addClass('long_paragraph');

你调整上面XX=40的字符数。

并在 css 中添加：

p.long_paragraph {font-size:70%;}

（我找到了 javascript here）

【讨论】：

这到底是做什么的？
这会计算您网站上每个 <p> 内的字符数，并且当且仅当 <p> 内的字符数超过 40 个时才添加 CSS 类。然后在你的 CSS 文件中，如果标签内有超过 40 个字符，你需要添加你想要生效的样式。
如果您只想在手机/小屏幕上生效，您还必须在您的 css 中使用 @media。
@chrishughes 在这里查看小提琴：jsfiddle.net/dL1zzdtg/3 我为所有小于 500 像素的屏幕添加了媒体查询。尝试调整窗口大小，看看当窗口小于 500 px 宽时它如何生效。（您在哪里看到 HTML 输出）
你不明白我在告诉你什么吗？？！！ @Preben