Html 在outlook 2010中查看的新闻稿模板中的按钮看起来不同

Html 在outlook 2010中查看的新闻稿模板中的按钮看起来不同,html,responsive-design,outlook,newsletter,Html,Responsive Design,Outlook,Newsletter,您好,我对outlook中的“新闻稿模板”按钮有问题,该按钮似乎太粘,但我在其他表中使用了相同的代码,其他表中的按钮似乎没有问题:( 这是我这张表的代码 <table cellspacing="0" cellpadding="0"> <tbody><tr>

您好,我对outlook中的“新闻稿模板”按钮有问题,该按钮似乎太粘,但我在其他表中使用了相同的代码,其他表中的按钮似乎没有问题:( 这是我这张表的代码

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>

显示自然错误,并将其放在正确的位置

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>
我使用相同的代码在此表中创建按钮,但看起来不同:

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>
和其他客户

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>

有人能帮忙吗???

你不需要这些。这里有两种方法可以让按钮工作:

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>
设置填充和无表格高度:

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>
<table width="90" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td bgcolor="#c8c8ca" align="center" style="color:#394A58; font-family:Arial, sans-serif; font-size:12px; text-decoration:none; font-weight:bold; padding:10px;">
      Read More
    </td>
  </tr>
</table>

阅读更多
设置桌子高度和垂直对齐

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>
<table width="90" height="35" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td bgcolor="#c8c8ca" align="center" valign="middle" style="color:#394A58; font-family:Arial, sans-serif; font-size:12px; text-decoration:none; font-weight:bold;">
      Read More
    </td>
  </tr>
</table>

阅读更多
另外,将
-webkit text size adjust:none;
放在
样式标记中,这样您就不必反复调用它了

                                    <table cellspacing="0" cellpadding="0">
                                        <tbody><tr>
                                            <!--<td valign="top" class="" style="padding:0 0px 15px 0">

                                            </td>-->
                                            <td valign="left" class="" style=""><a style="text-decoration: none; font-size: 16px; color: #394A58; font-weight: bold; font-family:Arial, sans-serif " href="#">Info </a>
                                            </td>
                                        </tr>
                                    </tbody></table>    
                                     <p class="" style="color:#394A58; text-align:left; font-size: 11px; line-height:17px">Iste natus error sit volu ptatem accusa tium dolor emque lauda ntium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
                                        <table cellspacing="0" cellpadding="0" width="90" height="20" align="left" style="mso-table-lspace:5px;mso-table-rspace:5px; margin:0;">

                                                    <tbody>
                                                        <td bgcolor="#c8c8ca" align="center" class="" style=";padding-top:2px; padding-right:0px;padding-bottom:2px ;padding-left:0px;background-color:#c8c8ca; border-top:0px ; border-bottom:0px; border-left:0px;border-right:0px;solid #eee; background-repeat:repeat-x">
                                                            <a style="
                                                            mso-table-lspace:5px;mso-table-rspace:5px;
                                                            color:#394A58;
                                                            font-size:12px;
                                                            font-weight:bold;
                                                            text-align:center;
                                                            text-decoration:none;
                                                            font-family:Arial, sans-serif;
                                                            -webkit-text-size-adjust:none;" href="">
                                                                    Read More
                                                            </a>
                                                        </td>
                                                    </tbody></table>
                                                </td>
                                            </tr>      
                                        </tbody></table>                                                        
                                    </td>
                              </tr>