移动设备上的双字体大小

Question

也许这个问题很简单，但我不知道如何解决这个问题，也没有真正的想法我应该输入谷歌;）

在我的CSS中，我有以下声明：

body { font-size: 100%; }

不，因为新的高密度设备显示我的字体非常小，我希望将该声明设置为：

body { font-size: 200%; }

在没有创建/链接其他文件或对用户代理进行某些服务器端处理的情况下，最简单的方法是什么？

Answer 1

使用移动浏览器检测（服务器端或客户端）。您可以在http://detectmobilebrowsers.com/找到此信息。如果浏览器是移动版，请将类mobile添加到正文标记。

E.g。如果你使用Detect Mobile Browsers的jQuery代码：

$(document).ready(function()
{
    if(jQuery.browser.mobile)
    {
        $('body').addClass('mobile');
    }
});

然后，在您的CSS中，您可以使用body.mobile {}和.mobile .something {}来应用移动设备特定的样式。

Answer 2

“智能”高密度手机将自动为您处理（例如带有Retina显示屏的ios设备）。一个不太聪明的人不会，但请注意用户已经习惯了这一点，所以你可能根本不想调整他们的字体，因为他们可能已经这样做了。

Answer 3

html {-webkit-text-size-adjust: none;}