html - 电子邮件签名在回复时搞砸了-6ren

html - 电子邮件签名在回复时搞砸了

转载作者：太空宇宙更新时间：2023-11-04 01:56:45

我的电子邮件签名有问题。在 Outlook 中回复时会弄乱。

发生了什么:当我将带有签名的电子邮件从 Outlook 2016(在 Mac 上)发送到 Outlook 2007(在 Windows 上)时，它看起来不错。回复那封电子邮件时，它看起来仍然不错。当回复那封电子邮件时，签名被弄乱了。截图:enter image description here

我的代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

<title></title>

<style type="text/css">
/* Client-specific Styles */

#outlook a {
    padding: 0;
} /* Force Outlook to provide a "view in browser" menu link. */
body {
    width: 100% !important;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    margin: 0;
    padding: 0;
}
/* Prevent Webkit and Windows Mobile platforms from changing default font sizes, while not breaking desktop design. */
.ExternalClass {
    width: 100%;
} /* Force Hotmail to display emails at full width */
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font,     .ExternalClass td, .ExternalClass div {
    line-height: 100%;
} /* Force Hotmail to display normal line spacing. */
#backgroundTable {
    margin: 0;
    padding: 0;
    width: 100% !important;
    line-height: 100% !important;
}
img {
    outline: none;
    text-decoration: none;
    border: none;
    -ms-interpolation-mode: bicubic;
}
a img {
    border: none;
}
.image_fix {
    display: block;
}
p {
    margin: 0px 0px !important;
}
table td {
    border-collapse: collapse;
}
table {
    border-collapse: collapse;
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
}

 /*##############################################*/
 /*IPHONE STYLES*/
 /*##############################################*/
@media only screen and (max-width: 480px) {
    table {
    position: relative;
}

table[class="fluid-table"], td[class="fluid-cell"]{
    width: 100% !important;
}

}
</style>

</head>


<body>
<div class="block"> 

    <!-- Start of name, function title and logo -->

    <table border="0" cellpadding="0" cellspacing="0" class="fluid-table">
        <tbody>

          <tr>
            <td style="display:block; border:none; outline:none; text-decoration:none; color:#000; font-size:14px; text-align:left; font-family: Open Sans, Arial, Verdana, sans-serif;" border="0">
                <span style="text-align: left; color: #9C1C27;font-size: 15px; font-weight: bold">Voornaam en Achternaam</span><br/>
                <span style="text-align: left; color: #B5987F; font-weight: normal; font-style:italic; font-size: 14px;">Functie titel</span><br/>
        </td>
      </tr>
        <tr>
            <td>
                <a href="http://www.deleeuwhides.com/"><img src="http://www.deleeuwhides.com/img/logo.png" nosend="1" border="0" style="width:179px; height:111px; padding: 10px 0 5px 0;"  alt="De Leeuw Hides logo" title="De Leeuw Hides logo" /></a>
            </td>
        </tr>
    </tbody>
</table>
<!-- End of name, function and logo -->

<table cellpadding="0" cellspacing="0" border="0" width="100%">
    <tr>
      <td><table cellpadding="0" cellspacing="0" border="0" width="600" class="fluid-table">
          <tr>

            <!-- Start of first column --> 

            <td><table width="175" align="left" border="0" cellpadding="0" cellspacing="0" class="fluid-table">
                <tbody>

                  <tr>
                    <td width="175" style=" border:none; text-decoration:none; color:#B5987F; font-size:14px; text-align:left; font-family: Open Sans, Arial, Verdana, sans-serif;" border="0">
                        <strong style="color:#9C1C27;">Location Nijmegen</strong><br/>
                        Lindenhoutseweg 69<br/>
                        6545 AH Nijmegen <br/>
                        The Netherlands
                    </td>   
                  </tr>

                </tbody>
              </table>

              <!-- End of first column --> 


              <!-- Start of second column -->

              <table width="175" align="left" border="0" cellpadding="0" cellspacing="0" class="fluid-table">
                <tbody>

                  <tr>
                    <td width="175" style="border:none; text-decoration:none; color:#B5987F; font-size:14px; text-align:left; font-family: Open Sans, Arial, Verdana, sans-serif;" border="0">
                        <strong style="color:#9C1C27;">Location Winterswijk</strong><br/>
                        Industrieweg 2a<br/>
                        7102 DZ Winterswijk<br/>
                        The Netherlands
                    </td>
                  </tr>
                </tbody>
              </table>

              <!-- End of second column --> 



              <!-- Start of third column -->

              <table width="175" align="left" border="0" cellpadding="0" cellspacing="0" class="fluid-table">
                <tbody>
                  <tr>
                     <td width="175" style="border:none; text-decoration:none; color:#B5987F; font-size:14px; text-align:left; font-family: Open Sans, Arial, Verdana, sans-serif;" border="0">
                            <a href="tel:0031-024-3775233" style="color:#B5987F;">T:0031-024-3775233</a> <br/>
                            <span style="text-decoration:none">F: 0031-024-3779316</span> <br/>
                            <a style="text-decoration:none; color:#9C1C27;" href="mailto:sales@deleeuwhides.nl"><span style="text-decoration:none; color:#9C1C27;">sales@deleeuwhides.nl</span></a><br/>
                            <a style="text-decoration:none; color:#9C1C27;" href="http://www.deleeuwhides.com"><span style="text-decoration:none; color:#9C1C27;">www.deleeuwhides.com</span></a>
                        </td>
                  </tr>
                </tbody>
              </table>

              <!-- End of third column -->
            </td>
          </tr>
        </table>


        <!-- Start of branding identity elements -->
        <table cellpadding="0" cellspacing="0" border="0" width="100%"  class="fluid-table">
           <tr>
                <td style="height:3px; width:100%; background-color:#B5987F;">
                </td>
            </tr>
        </table>

        <table cellpadding="0" cellspacing="0" border="0" width="100%"class="fluid-table">
           <tr>
                <td style="height:2px; width:100%; background-color:#fff;">
                </td>
            </tr>
        </table>


            <table cellpadding="0" cellspacing="0" border="0" width="100%" class="fluid-table">
                    <tr>
                        <td valign="middle" style="height:30px; width:100%; background-color:#9C1C27;"><center><img style="display:block;" src="http://www.deleeuwhides.com/img/slogan-footer.png" alt="slogan"></center>
                        </td>
                   </tr>
            </table>
        <!-- End of branding identity elements-->

      </td>
    </tr>
  </table>

</div>
</body>
</html>

为什么会发生这种情况，我该如何解决？

最佳答案

我从 http://putsmail.com 向我发送了您的消息到我的 Outlook 地址，回复我的 gmail，然后回复我的 Outlook 并得到这个:

当我回复 gmail 时，它看起来很好。

我的建议是将 valign="top" 添加到相关表格中的 tr 和 td 单元格中。这将强制表格单元格对齐。

        <!-- Start of first column --> 

        <td valign="top">
          <table width="175" align="left" border="0" cellpadding="0" cellspacing="0" class="fluid-table">
            <tbody>

              <tr valign="top">
                <td valign="top" width="175" style=" border:none; text-decoration:none; color:#B5987F; font-size:14px; text-align:left; font-family: Open Sans, Arial, Verdana, sans-serif;" border="0">
                    <strong style="color:#9C1C27;">Location Nijmegen</strong><br/>
                    Lindenhoutseweg 69<br/>
                    6545 AH Nijmegen <br/>
                    The Netherlands
                </td>   
              </tr>

            </tbody>
          </table>

          <!-- End of first column --> 


          <!-- Start of second column -->

          <table width="175" align="left" border="0" cellpadding="0" cellspacing="0" class="fluid-table">
            <tbody>

              <tr valign="top">
                <td valign="top" width="175" style="border:none; text-decoration:none; color:#B5987F; font-size:14px; text-align:left; font-family: Open Sans, Arial, Verdana, sans-serif;" border="0">
                    <strong style="color:#9C1C27;">Location Winterswijk</strong><br/>
                    Industrieweg 2a<br/>
                    7102 DZ Winterswijk<br/>
                    The Netherlands
                </td>
              </tr>
            </tbody>
          </table>

          <!-- End of second column --> 



          <!-- Start of third column -->

          <table width="175" align="left" border="0" cellpadding="0" cellspacing="0" class="fluid-table">
            <tbody>
              <tr valign="top">
                 <td valign="top" width="175" style="border:none; text-decoration:none; color:#B5987F; font-size:14px; text-align:left; font-family: Open Sans, Arial, Verdana, sans-serif;" border="0">
                        <a href="tel:0031-024-3775233" style="color:#B5987F;">T:0031-024-3775233</a> <br/>
                        <span style="text-decoration:none">F: 0031-024-3779316</span> <br/>
                        <a style="text-decoration:none; color:#9C1C27;" href="mailto:sales@deleeuwhides.nl"><span style="text-decoration:none; color:#9C1C27;">sales@deleeuwhides.nl</span></a><br/>
                        <a style="text-decoration:none; color:#9C1C27;" href="http://www.deleeuwhides.com"><span style="text-decoration:none; color:#9C1C27;">www.deleeuwhides.com</span></a>
                    </td>
              </tr>
            </tbody>
          </table>

          <!-- End of third column -->
        </td>
      </tr>
    </table>


    <!-- Start of branding identity elements -->
    <table cellpadding="0" cellspacing="0" border="0" width="100%"  class="fluid-table">
       <tr>
            <td style="height:3px; width:100%; background-color:#B5987F;">
            </td>
        </tr>
    </table>

    <table cellpadding="0" cellspacing="0" border="0" width="100%"class="fluid-table">
       <tr>
            <td style="height:2px; width:100%; background-color:#fff;">
            </td>
        </tr>
    </table>


        <table cellpadding="0" cellspacing="0" border="0" width="100%" class="fluid-table">
                <tr>
                    <td valign="middle" style="height:30px; width:100%; background-color:#9C1C27;"><center><img style="display:block;" src="http://www.deleeuwhides.com/img/slogan-footer.png" alt="slogan"></center>
                    </td>
               </tr>
        </table>
    <!-- End of branding identity elements-->

  </td>
</tr>

关于html - 电子邮件签名在回复时搞砸了，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42443883/

文章推荐： node.js - Mocha 通过继承测试 javascript

文章推荐： python - 如何从元素中提取链接？

文章推荐： css - 悬停不适用于自定义按钮

太空宇宙

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

html - 电子邮件签名在回复时搞砸了