css - 在不设置视口(viewport)的情况下，增加手机 css 中的 JUST 字体大小

Question

通常，当我创建响应式网站时，我会按照设备宽度设置视口(viewport)，并为不同的屏幕分辨率创建不同的布局。

但我正在对一个旧站点做一些调整，该站点具有粗大的按钮、默认字体大小和简单的布局，实际上，当它作为桌面样式的固定宽度布局查看时看起来非常有用，即使在小移动设备。

与其指定一个视口(viewport)并完全重写所有的 css 来制作一系列适合移动设备的版本，我真的很想稍微增加主体元素的字体大小以便在实际较小的屏幕上查看:对于这个特定的布局，这将非常有用 - 如果我能弄清楚如何去做!

这是 -webkit-text-size-adjust: 的用途吗？看起来这应该是一件容易调整的事情，但我所有的谷歌搜索都发现了完全响应式的设计方法，这对于这个特定的小任务来说有点过分了。

Answer 1

实现它的一种方法是使用 window.screen.width 属性通过 javascript 检测屏幕宽度，然后从那里应用您想要的样式。

这是一个使用 jquery 的示例，但是如果您不想使用库，则可以使用 native javascript 实现同样的效果 http://jsfiddle.net/UXV7Z/

您可以根据需要在分辨率中应用任意数量的过滤器，就像使用媒体查询一样