gpt4 book ai didi

css - 响应式电子邮件在 iPhone 上不起作用

转载 作者:行者123 更新时间:2023-11-28 11:19:53 24 4
gpt4 key购买 nike

我是响应式设计的新手,所以我提前道歉。我正在处理我当前的电子邮件,并使其中的一部分具有响应性。我有一封 3 栏的电子邮件,希望它堆叠到一栏,并使文本变大。我已经通过浏览器获得了成功的结果,但是一旦我在我的 iPhone 5 上检查它,我什么也得不到。我已经发送到 AOL、Gmail 和 Outlook 帐户,但没有人对其中一栏使用react。我在下面列出了我的风格。同样,我对整个媒体查询都不熟悉,所以如果看起来很荒谬,我深表歉意。

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style type="text/css">
@media only screen and (max-width: 660px) {
table.container {width: 100% !important; padding:0 4px;}
table.container {
text-align: center !important;
font-size:20px !important;
}

.templateColumnContainer{
display:block !important;
width:100% !important;
}
}

@media only screen and (max-width: 568px) {

table.container {width: 100% !important; padding:0 4px;}
table.container {
text-align: center !important;
font-size:20px !important;
}

.templateColumnContainer {
display:block !important;
width:100% !important;
}
}
@media only screen and (max-width: 480px) {

table.container {width: 100% !important; padding:0 4px;}
table.container {
text-align: center !important;
font-size:20px !important;
}

.templateColumnContainer {
display:block !important;
width:100% !important;
}
}

@media only screen and (max-width: 320px) {

table.container {width: 280px !important; padding:0 4px;}
table.container {
text-align: center !important;
font-size:20px !important;
}

.templateColumnContainer {
display:block !important;
width:100% !important;
}
}


</style>
</head>

最佳答案

Gmail、AOL 和 Outlook.com 所有 do not support媒体查询。尝试将其发送到 iPhone 上的默认邮件阅读器。

关于css - 响应式电子邮件在 iPhone 上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21589201/

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