我正在开发自己的响应电子邮件框架。
我在iPhone上的字体大小有问题，当手机处于横向模式时，字体大小变得太大。我尝试了-webkit-text-size-adjust：100％;就像其他主题中所建议的那样，但是看来我找到的解决方案对我不起作用。我正在用Acid On Acid测试我的框架。
这是代码：
的HTML
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="email-background">
<div class="email-container">
<p class="center">Lorem ipsum dolor sit amet,
consectetur adipiscing elit. Fusce non diam consectetur, tempor sapien id,
semper mi.</p>
</div>
</div>
</body>
</html>
的CSS
body {
-webkit-text-size-adjust: 100%;
}
p {
font-family: 'Verdana', sans-serif;
font-size: 14px;
color: #000000;
line-height: 1.5;
margin: 20px;
}
.center {
text-align: center;
}
最佳答案
好的，因此我尝试重新创建您的示例，并使其能够正常工作。这是我在iPhone上测试过的代码，对我来说看起来很正常。
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
p {
font-family: 'Verdana', sans-serif;
font-size: 14px;
color: #000000;
line-height: 1.5;
margin: 20px;
-webkit-text-size-adjust: auto <!-- I changed it to auto and moved it -->
<!-- to the paragraph tag. -->
}
.center {
text-align: center;
}
</style>
</head>
<body>
<div class="email-background">
<div class="email-container">
<p class="center">Lorem ipsum dolor sit amet,
consectetur adipiscing elit. Fusce non diam consectetur, tempor sapien id,
semper mi.</p>
</div>
</div>
</body>
</html>
希望这可以帮助！