HTML 通过电子邮件发送图片

Question

我刚刚参加了一份电子邮件开发人员的家庭考试。我的任务是尽力从 .png 文件创建一个 HTML 电子邮件。我一直在使用表格，我来到了一个部分，我必须在文本旁边插入图像，我正在崩溃和燃烧。 header 文本与段落的距离太远，图片也不太合适；有没有人对如何解决这个问题有任何想法？我的代码如下：

       
div #costume-section {
    
    width:645px;
    height: 225px;
    padding-left: 05px;
    background: #ff821d;
    color: white;    
           
}

 <div id="costume-section">
         <table>
             <th id="cos-font">Costume Contest</th>
             <tr>
               <td>Duhh, of course - Wear it all day if you wanna. Perhaps you will be the winner of the contest? (must be present at party to be voted on)  We'll hold a kid contest too!</td>
                 <td><img src="http://mandrill-emails.s3.amazonaws.com/melt-holidays/20151020/costumes.png"  /></td>
             </tr>
         </table>
     </div>

Answer 1

拉切尔杰夫

像处理电子表格一样思考这个问题。您设置了 th 和 tr table 行。

由于您的 header 文本位于包含 2 td 的行之外，因此 header 文本位于包含该文本的 tr 之上，并且图片。

重新排列 table 标记，在这种情况下您并不真正需要 th，除非它是必需的。

 <div id="costume-section">
         <table>
             <tr>
               <td>
               <h1>Costume Contest</h1>
               Duhh, of course - Wear it all day if you wanna. Perhaps you will be the winner of the contest? (must be present at party to be voted on)  We'll hold a kid contest too!</td>
                 
                 <td><img src="http://mandrill-emails.s3.amazonaws.com/melt-holidays/20151020/costumes.png"  /></td>
             </tr>
         </table>
     </div>

HTML 通过电子邮件发送图片

HTML Email Images

html

email

html-email