HTML email

最新推荐文章于 2023-07-08 23:13:21 发布

yaxi_yaxi_yaxi

最新推荐文章于 2023-07-08 23:13:21 发布

阅读量762

点赞数

分类专栏： html 文章标签： email html

本文链接：https://blog.csdn.net/qq_35176916/article/details/84932628

版权

html 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

HTML邮件

规则： 必须使用table布局，必须使用内联样式，不要使用margin与padding，定位，等。

案例：

案例图片

设计：
这里你可以将图片分为3行，然后给有内容的部分，td设置vertical-align=top,即可快速的进行布局

代码：

 <table cellpadding="0" cellspacing="0"  border="0" align="center" style="background:url(./img/2-2.jpg) no-repeat;height: 182px;" width="381">
       <tr style="height:14px;"><td rowspan="5" width="18"></td><td width="165"></td><td  width="198"></td></tr>
       <tr style="height: 39px;">
           <td rowspan="3"><a href="#"><img src="./img/long_img.jpg" style="height:150px;width:150px; display: block; border:0;"/></a></td>
        <td><span style="font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#333333">iiutec R-Cruiser Ultra Slim Vacuum Cleaner Household Cleaning...</span>
        </td>
      </tr>
       <tr style="height: 42px"><td></td></tr>
       <tr style="height: 70px">
           <td><span class="old_price" style="font-family:宋体; font-size:14px; color:#666666">$87.1</span><span class="new_price" style="font-family:Arial, Helvetica, sans-serif;font-weight:bold; font-size:18px; color:#ff6600">$69.63</span></td></tr>
       <tr style="height: 15px;">
           <td></td><td></td>
       </tr>
    </table>```