Question

我使用以下电子邮件模板（我选择了基本的模板）来自zurb

http://zurb.com/playground/responsive-email-templates http://zurb.com/playground/projects/responsive-email-templates/basic.html

包括以下媒体查询：

@media only screen and (max-width: 600px) {
    a[class="btn"] { display:block!important; margin-bottom:10px!important; background-image:none!important; margin-right:0!important;}
    div[class="column"] { width: auto!important; float:none!important;}
    table.social div[class="column"] {
        width:auto!important;
    }
}

手机上的字体看起来很小，特别是表格单元格内的文字太小了

如何覆盖手机上的字体？

Answer 1

也许您可以做的最好的事情是浏览文件并将所有字体大小从px更改为em。但是，1em等于12px，所以你必须做一些数学计算才能得到正确的数字。然后，您可以向

添加样式

body {font-size: 120%;}

这会将字体大小更改为通常的字体大小的120％。您可以将其更改为您喜欢的任何百分比，它将根据您为每个元素提供的em值更改所有字体。然后，如果您想一次更改所有字体大小，只需更改该百分比...然后您就不会失去比例。您还可以通过向body元素添加font-size：100％来使桌面保持不变。然后，在媒体查询中，您可以将正文字体大小设置为120％。

iPhone上的字体大小

1 个答案: