gpt4 book ai didi

HTML 电子邮件模板宽度 100% 在 Gmail 中不起作用

转载 作者:太空宇宙 更新时间:2023-11-04 00:57:25 25 4
gpt4 key购买 nike

我正在尝试创建一个 html 电子邮件模板,当我测试我的模板时,我注意到我无法让我的模板具有 100% 的宽度。有一个我的 div 没有延伸到的空白区域。

enter image description here

我的html代码

                        "<html style=\"font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size: 14px; min-width:100% !important; margin: 0;\">" +
"<head>\n" +
"<meta name=\"viewport\" content=\"width=device-width\" />\n" +
"<meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\" />\n" +
"<title>Spokk email service</title>\n" +
"\n" +
"<style type=\"text/css\">\n" +
"@media only screen and (max-width: 640px) {\n" +
"}\n" +
"</style>\n" +
"</head>" +
"<body style=\"font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; font-size: 14px; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; min-width: 100%!important; height: 100%; line-height: 1.6em; background-color: #f6f6f6; margin: 0;\" bgcolor=\"#f6f6f6\">" +
"Mom" +
"</body/>"+
"</html>

引号在那里是因为我在 java 文件中使用它。如何让我的电子邮件模板达到 100% 宽度。

此问题仅存在于 gmail 移动应用程序中。在网络中,电子邮件正确显示

最佳答案

我之前在 iOS 和 Android 上的 Gmail 中都遇到过这个问题。

我正在使用以下代码在电子邮件的 CSS 重置中删除移动 Gmail 的装订线,它似乎可以解决问题:

<style>
/* iPhone 4, 4S, 5, 5S, 5C, and 5SE */
@media only screen and (min-device-width: 320px) and (max-device-width: 374px) {
u ~ div .email-container {
min-width: 320px !important;
}
}
/* iPhone 6, 6S, 7, 8, and X */
@media only screen and (min-device-width: 375px) and (max-device-width: 413px) {
u ~ div .email-container {
min-width: 375px !important;
}
}
/* iPhone 6+, 7+, and 8+ */
@media only screen and (min-device-width: 414px) {
u ~ div .email-container {
min-width: 414px !important;
}
}
</style>

我知道这些在评论中说“iPhone”,但这只是描述设备视口(viewport)大小的引用。您可以为每个要修复的额外视口(viewport)尺寸创建更多此类媒体查询。

关于HTML 电子邮件模板宽度 100% 在 Gmail 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54249790/

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