电子邮件签名块显示奇怪,分解和填充

时间:2018-03-19 18:37:54

标签: html gmail html-email

我制作了一个html电子邮件签名,在浏览器中打开它看起来很好,并将其粘贴到我的gmail签名部分,每个单独的块现在都有填充,而且有些块并排而是彼此相邻。 奇怪的是,有些侥幸我设法让它看起来很好看。这就是它应该是这样的https://postimg.org/image/uytldx3zd/

以下是我使用的代码 - 我做错了什么? 任何修复都会非常感激, 感谢



<html>
     <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <style media="screen" type="text/css">
    	td {line-height:0; font-size: 0.0em; }
    	img { display: block; float: left; padding: 0; align: absbottom; align: texttop; }
    </style>
    </head>
    
    
    <!-- Paste Code Under This Line
    _________________________________________________________________________________ -->
    
    <title>emailsignature_500flat</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    </head>
    <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <!-- Save for Web Slices (emailsignature_500flat.psd) -->
    <table id="Table_01" width="550" height="357" border="0" cellpadding="0" cellspacing="0">
    	<tr>
    		<td>
    			<a href= callto:4411893280328><img src="https://s20.postimg.org/tk69dnist/emailsignature_500flat_01.jpg" width="254" height="50" alt=""><a href= callto:441189328032></td>
    		<td rowspan="3">
    			<a href=http://thereadinesscomp.com><img src="https://s20.postimg.org/o8rcsyrl9/emailsignature_500flat_02.jpg" width="296" height="113" alt=""><a href=http://thereadinesscom.com></td>
    	</tr>
    	<tr>
    		<td>
    			<a href=http://thereadinesscomp.com><img src="https://s20.postimg.org/s54ooxx59/emailsignature_500flat_03.jpg" width="254" height="32" alt=""></td>
    	</tr>
    	<tr>
    		<td>
    			<a href=https://www.linkedin.com/company/129626/><img src="https://s20.postimg.org/oya55b4zh/emailsignature_500flat_04.jpg" width="254" height="31" alt=""></td>
    	</tr>
    	<tr>
    		<td colspan="2">
    			<a href=mailto:info@thereadinesscomp.com><img src="https://s20.postimg.org/c6vyytq2l/emailsignature_500flat_05.png" width="550" height="146" alt=""><a href=mailto:info@thereadinesscomp.com></td>
    	</tr>
    	<tr>
    		<td colspan="2">
    			<img src="https://s20.postimg.org/t7ev7hnod/emailsignature_500flat_06.jpg" width="550" height="98" alt=""></td>
    	</tr>
    </table>
    <!-- End Save for Web Slices -->
    </body>
    <!-- Keep Pasted Code Above This Line!
    _________________________________________________________________________________ -->
    </html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

我在您的代码中发现了以下错误。

  • 缺少关闭锚标记,
  • 缺少colspan
  • CSS应该始终内联

以下是您需要的HTML:

&#13;
&#13;
<table id="Table_01" width="550" height="357" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td style="line-height:0; font-size: 0.0em;">
        
				<table width="100%" border="0" cellpadding="0" cellspacing="0">
				<tr>
				  <td style="line-height:0; font-size: 0.0em;">
				  
					<table width="100%" border="0" cellpadding="0" cellspacing="0">
						<tr>
						  <td style="line-height:0; font-size: 0.0em;">
							<a href= callto:4411893280328><img src="https://s20.postimg.org/tk69dnist/emailsignature_500flat_01.jpg" width="254" height="50" alt="" style="display: block; float: left; padding: 0; align: absbottom; align: texttop; "></a>
						  </td>
						</tr>
						
						<tr>
						  <td style="line-height:0; font-size: 0.0em;">
							<a href=http://thereadinesscompany.com><img src="https://s20.postimg.org/s54ooxx59/emailsignature_500flat_03.jpg" width="254" height="32" alt="" style="display: block; float: left; padding: 0; align: absbottom; align: texttop; "></a>
						  </td>
						</tr>
						
						<tr>
						  <td style="line-height:0; font-size: 0.0em;">
							<a href=https://www.linkedin.com/company/1296265><img src="https://s20.postimg.org/oya55b4zh/emailsignature_500flat_04.jpg" width="254" height="31" alt="" style="display: block; float: left; padding: 0; " /></a>
						  </td>
						</tr>
					</table>
				  
				  
				  </td>
				  <td style="line-height:0; font-size: 0.0em;">
					<a href=http://thereadinesscompany.com><img src="https://s20.postimg.org/o8rcsyrl9/emailsignature_500flat_02.jpg" width="296" height="113" alt="" style="display: block;" border="0"></a>
				  </td>
				</tr>
				</table>
		

        </td>
		
	</tr>
	<tr>
		<td style="line-height:0; font-size: 0.0em;">
			<a href=mailto:info@thereadinesscompany.com><img src="https://s20.postimg.org/c6vyytq2l/emailsignature_500flat_05.png" width="550" height="146" alt="" style="display: block; float: left; padding: 0; align: absbottom; align: texttop; "></a>
		</td>
		
	</tr>
	<tr>
		<td style="line-height:0; font-size: 0.0em;">
			<img src="https://s20.postimg.org/t7ev7hnod/emailsignature_500flat_06.jpg" width="550" height="98" alt="" style="display: block; float: left; padding: 0;">
		</td>
		
	</tr>
		
		
    </table>
&#13;
&#13;
&#13;

请告诉我这是否适合您。