gpt4 book ai didi

html - html 电子邮件中的奇数空格

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

我正在为我公司正在进行的一些营销制作 HTML 电子邮件。我一辈子都弄不明白 table 底部的缝隙。我有嵌套表作为优化所有电子邮件客户端的协议(protocol)。我不能使用疯狂的 css,必须内联或嵌入(我的平台将内联运行嵌入式 css。

我的代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Laser Vision Care Center Wants To Help You See More Clearly</title>

<style type="text/css">

table {
border-collapse: collapse;
border-spacing: 0;
border: 0;
background:#d7bd83;



}


</style>

</head>

<body>
<table width="600" cellpadding="0" cellspacing="0" border="0" align="center" style="background:#e6cc89;color:#fff;font-family:Arial, Helvetica, sans-serif; font-size:12px">

<tr cellpadding="0" cellspacing="0">
<td cellpadding="0" cellspacing="0">
</td>
<tr cellpadding="0" cellspacing="0">
<td cellpadding="0" cellspacing="0" valign="middle" style="background:#e0c788;text-align:center;font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;color:#222961;font-weight:Bold;font-size:20px">"Our Focus Is On The Health Of Your Eyes"</td>
</tr>
<tr cellpadding="0" cellspacing="0">
<td width="600" cellpadding="0" cellspacing="0">
<img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/BannerImage.jpg">
</td>
</tr>
<tr cellpadding="0" cellspacing="0">
<td cellpadding="0" cellspacing="0">
<table width="600" cellpadding="0" cellspacing="0">
<tr cellpadding="0" cellspacing="0">
<td cellpadding="0" cellspacing="0" width="232">
<img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/ArrowTop.jpg">
</td>
<td cellpadding="0" cellspacing="0" width="368" align="right" style="background:#e6cc89;"><p><span style="font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;font-weight:400;font-size:22px;color:#6f6f6f;margin-right:20px;">WAKE UP TO CLEAR VISION WITH</span><br>
<span style="font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;font-weight:400;font-size:27px;color:#6f6f6f;margin-right:20px;">ALL LASER CUSTOM LASIK</span></p>

</td>
</tr>
</table>
</td>
</tr>
<tr>
<td cellpadding="0" cellspacing="0">
<table width="600" cellpadding="0" cellspacing="0">
<tr>
<td cellpadding="0" cellspacing="0" width="232">
<img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/ArrowSecond.jpg">
</td>
<td cellpadding="0" cellspacing="0" width="368">
<img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/ClickHere.jpg">

</td>
</tr>
</table>
</td>
</tr>
<tr>
<td cellpadding="0" cellspacing="0">
<table width="600" cellpadding="0" cellspacing="0">
<tr cellpadding="0" cellspacing="0" style="background:#e6cc89;">
<td cellpadding="0" cellspacing="0" width="231">
<img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/ArrowThird.jpg">
</td>
<td cellpadding="0" valign="top" cellspacing="0" width="369" align="right" style="top-margin:0;"><a href="tel:1-313-724-2733" style="text-decoration:none;"><span style="font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;font-weight:400;font-size:31px;color:#3d3e3e;">or call (313) 724-2733</span></a>
</td>
</tr>
</table>
</td>
</tr>
<tr cellpadding="0" cellspacing="0">
<td width="600" cellpadding="0" cellspacing="0">
<img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/ArrowFouth.jpg">
</td>
</tr>
<tr>
<td cellpadding="0" cellspacing="0">
<table cellpadding="0" cellspacing="0">
<tr cellpadding="0" cellspacing="0" style="background:#e6cc89;">
<td cellpadding="0" cellspacing="0" width="222" align="left">
<img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/ArrowFifth.jpg">
</td>
</tr>
</table>
<tr cellpadding="0" cellspacing="0">
<td width="600" align="center">
<table cellpadding="0" cellspacing="15">
<tr>
<td width="41">
<a href="#"><img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/Facebook.jpg"></a>
</td>
<td width="40" cellpadding="0" cellspacing="0">
<a href="#"><img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/Twitter.jpg"></a>
</td>
<td width="41" cellpadding="0" cellspacing="0">
<a href="#"><img style="display:block;" src="http://truemailmarketing.com/campaigns/2014/july/LaserVisionCareCenter/Instagram.jpg"></a>
</td>
</tr>
</table>
<tr cellpadding="0" cellspacing="0">
<td cellpadding="0" cellspacing="0" style="text-align:center;">
<a href="http://www.lvccenter.com" style="text-decoration:none;"><span style="font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;text-weight:400;font-size:12px;color:#6f6f6f;">www.lvccenter.com</span></a>
</td>
</tr>
<tr>
<td cellpadding="0" cellspacing="0" style="text-align:center;">
<p><span style="font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;text-weight:400;font-size:10px;color:#6f6f6f;">23522 Michigan Avenue Dearborn, MI 48124</span></p>
</td>
</tr>






</table>
</body>
</html>

最佳答案

你的第一个差距是因为你的一个 p标签使用默认边距。制作 <p style="margin:0;">修复它(即第 47 行)。

第二个差距是因为您有两个高度不同的图像:ArrowSecond.jpg 是 73px,而 ClickHere.jpg 是 74px。您需要使它们与表格行匹配才能对齐。

P.S.:您的 html 需要一些小的修复。尝试将其输入 html 验证器。

P.S.2:单词“WAKE”和“ALL”没有垂直排列。

关于html - html 电子邮件中的奇数空格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24760780/

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