Question

使用html代码和VML（用于背景图像）向客户发送简报。在使用VML内联CSS之前工作正常，但是当VML添加到代码中时，它在OUTLOOK中停止工作。

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
   <html xmlns:v="urn:schemas-microsoft-com:vml">



             <head>

             <meta charset="utf-8" name="viewport" content="width:50"/>

             <title> Transaction Alert from KVB </title>

             </head>

             <body>

              <div> 


    <table style="border:1px solid black" width="600" height="600" align="center" cellpadding="0" cellspacing="0" border="0" >

<tr>
<!-- Backup background color is #DDDDDD -->
    <td  style="background-image: url('http://www.kvbsmart.com/mail_img/bg.jpg');" background="http://www.kvbsmart.com/mail_img/bg.jpg"   valign="top" align="left" >

     <!--[if gte mso 9]>
   <v:rect style="width:600px;height:600px;" strokecolor="none">
      <v:fill type="tile"  src="http://www.kvbsmart.com/mail_img/bg.jpg"  color="#7bceeb"/></v:fill>
   </v:rect>
   <v:shape id="theText" style="position:absolute;width:600px;height:600px;">
   <![endif]-->



             <a href="http://www.kvb.co.in/">

         <center><img src="http://www.kvbsmart.com/mail_img/1111.png" width="600" height="300"></center>

         </a>

           <div STYLE="color: WHITE; background-color: #00844A; border: 1px solid white; padding: 15px;border-radius: 20px; border-collapse: separate;">

          <center><font face="Verdana">A.MESSAGE</center></font></div>

          <p><font face="Verdana" size ="1"><center>Note: If the transaction is not done by you, please contact our Helpline at the earliest.</font></center></p>

               <br><br><br><br>

           <a href="http://www.kvb.co.in/">

        <center><img src="http://www.kvbsmart.com/mail_img/mpay_new.png" width="600" height="130"></center>

        </a>

           <br>

            <br>

           <p><font face="Verdana">With Regards,</font></p>

          <p><font face="Verdana">Karur Vysya Bank.</font></p>


             <hr width = 100%>

            <br>

               <div style="max-width:auto; word-wrap:break-word;"><font   face="Verdana">This E-Alert was automatically generated by the system. Please do not reply to this mail. For any further clarifications, kindly contact your Home branch/our Helpline Number 1860 200 1916 (Local call charges applicable).</font>   </div>

                   <p><font face="Verdana"> This E-Alert was automatically generated by the system. Please do not reply to this mail. For any further clarifications, kindly contact your Home branch/our Helpline Number 1860 200 1916 (Local call charges applicable)</font> </p>





    <!--[if gte mso 9]>
     </v:shape>
     <![endif]-->

               </td></tr>


                </table></div>


                 <body></html>

我特别在这个街区遇到问题

 <div STYLE="color: WHITE; background-color: #00844A; border: 1px solid white; padding: 15px;border-radius: 20px; border-collapse: separate;">

          <center><font face="Verdana">A.MESSAGE</center></font></div>

请帮帮我，我正在添加截图供您参考

Answer 1

我通过删除div标签并将其替换为表

来解决了这个问题

我提供完整的代码

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
  <html xmlns:v="urn:schemas-microsoft-com:vml">  
   <head>                
   <meta charset="utf-8" name="viewport" content="width:50"/>
    <title> Transaction Alert from KVB </title>
     </head>
      <body>
        <div>             
<table  style="border:1px solid black" width="600" height="800" align="center" cellpadding="0" cellspacing="0" border="0"  >
 <tr>
<!-- Backup background color is #DDDDDD -->
              <td  style="background-image: url('http://www.kvbsmart.com/mail_img/bg.jpg');" background="http://www.kvbsmart.com/mail_img/bg.jpg"  valign="top"   align="left" >

      <!--[if gte mso 9]>
                                  <v:rect style="width:600px;height:900px;" strokecolor="none">
                                  <v:fill type="tile"  src="http://www.kvbsmart.com/mail_img/bg.jpg"  color="#7bceeb"/></v:fill>
                                   </v:rect>
                                  <v:shape id="theText" style="position:absolute;width:600px;height:900px;z-index:3;">
                    <v:textbox inset="0,0,0,0">

                                  <![endif]-->





                  <a href="http://www.kvb.co.in/">
                  <center><img src="http://www.kvbsmart.com/mail_img/1111.png" width="600" height="300"></center>
                  </a>

            <!------THIS IS THE PART WHERE I HAVE DONE THE MODIFICATION-->
                  <table width = "100%"  border-collapse: separate;    border-spacing: 0;>

                        <td STYLE="color: WHITE; background-color: #00844A; border: 1px solid white; padding: 15px;border-radius: 20px; border-collapse: separate;">

                                  <center><font face="Verdana">A.MESSAGE</center></font></td>
    </table>

                 <p><font face="Verdana" size ="1"><center>Note: If the transaction is not done by you, please contact our Helpline at the earliest.</font></center></p>

                   <br><br><br><br>

                   <a href="http://www.kvb.co.in/">

                   <center><img src="http://www.kvbsmart.com/mail_img/mpay_new.png" width="600" height="130"></center>

                  </a>

                   <br>

                      <br>

                       <p><font face="Verdana">With Regards,</font></p>

                              <p><font face="Verdana">Karur Vysya Bank.</font></p>


                         <hr width = 100%>

                        <br>

                       <div style="max-width:auto; word-wrap:break-word;"><font face="Verdana">This E-Alert was automatically generated by the system. Please do not reply to this mail. For any further clarifications, kindly contact your Home branch/our Helpline Number 1860 200 1916 (Local call charges applicable).</font></div>







                             <!--[if gte mso 9]>
                             </v:shape>
                               <![endif]-->  


                                           </td></tr>


            </table></div>


                                                     <body></html>

使用vml for html会产生内联css问题

1 个答案: