gpt4 book ai didi

html - -webkit 文本大小调整 : 100% doesn't work on iphone

转载 作者:行者123 更新时间:2023-11-28 17:33:36 25 4
gpt4 key购买 nike

我正在开发自己的响应式电子邮件框架。我在 iPhone 上遇到字体大小问题,当手机处于横向模式时,字体大小会变得太大。我试过 -webkit-text-size-adjust: 100%;正如其他主题中所建议的那样,但我发现的解决方案似乎对我不起作用。我正在使用 Email 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>

希望这对您有所帮助!

关于html - -webkit 文本大小调整 : 100% doesn't work on iphone,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25525015/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com