gpt4 book ai didi

html - 显示与浏览器不同的简单电子邮件 CSS

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

我正在尝试创建一个带有嵌入式 CSS 的简单电子邮件,但通过电子邮件发送给我的结果与我在浏览器中看到的结果大不相同。

这是我的代码:

<html>
<head>
<style>
body {
background-color: #96D60D;
}

div {
background-color: white;
border: 1px solid black;
margin-top: 100px;
margin-bottom: 100px;
margin-right: 150px;
margin-left: 80px;
padding: 20px;
}
</style>
</head>
<body>
<div>
<center><img src="logo.png">
</center>
<u>
<p>
<H1>API updates list:</H1>
</p>
</u>
<p>
<b>
<h2>Successful Entries</h2><br></b>
<ul>
<li>asdasdasd</li>
<li>asdasdasd</li>
<li>asdasdasd</li>
<li>asdasdasd</li>
<li>asdasdasd</li>
</ul>

<ul>
<li>asdasdasd</li>
<li>asdasdasd</li>
<li>asdasdasd</li>
<li>asdasdasd</li>
<li>asdasdasd</li>
</ul>
</p>
</div>
</body>
</html>

如您所见,它在浏览器中看起来棒极了:

https://www.w3schools.com/code/tryit.asp?filename=G1EU5RK1DPMG

但是,当放入电子邮件中时,它看起来很糟糕:

https://ibb.co/6FVJpZJ

有人知道如何解决这个问题吗?

最佳答案

我猜您正在使用 Outlook。它不完全支持某些 css 属性,而根本不支持其他一些属性。 Mailchimp 有一个很酷的页面,其中包含很多我认为对您有用的信息。只需检查您可以使用哪些属性。根据我的经验,框阴影、边距和边框半径真的让我发疯,因为这些更改不起作用。

在这里,您甚至可以找到 Outlook 桌面版和应用程序版之间的差异:https://templates.mailchimp.com/resources/email-client-css-support/

关于html - 显示与浏览器不同的简单电子邮件 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54817740/

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