1
HTML e-posta şablonunda çalışıyorum. Birkaç yuvalanmış tabloyla oluşturdum. Outlook'ta görüntülerin sağında boşluklar olduğunu gördüm. Bu yüzden düzeltmeye çalıştım ama düzeltmiyor. Son olarak, tablo hücrelerini tanımlamayı mümkün kılmak için oluşturduğum renkli görüntülere bağlı olarak basit bir şablon oluşturuyorum.HTML E-postasında Resimler Arasında Dikey Boşluk
İşte (Outlook üzerinde ve testi kopyalayın) benim kod:
<!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">
\t <head>
\t \t <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
\t \t <title>HTML Email Design Template</title>
\t \t <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
\t \t <style media="all" type="text/css">
\t \t table td {
\t \t \t border-collapse: collapse;
\t \t }
\t \t img { padding: 0; margin: 0; display:block;}
\t \t </style>
\t </head>
\t <body style="margin: 0; padding: 0;" bgcolor="#cccccc">
\t \t <table border="0" cellpadding="0" cellspacing="0" width="100%">
\t \t \t <tr>
\t \t \t \t <td>
\t \t \t \t \t <table bgcolor="#ffffff" align="center" border="0" cellpadding="0" cellspacing="0" width="600" height="600" style="border-collapse: collapse; border: 1px solid #000000;">
\t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t <td align="center" style="padding: 40px 0 40px 0; font-size: 26px; font-weight: bold; font-family: Arial, sans-serif;">
\t \t \t \t \t \t \t \t First Row
\t \t \t \t \t \t \t </td>
\t \t \t \t \t \t </tr>
\t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t <td>
\t \t \t \t \t \t \t \t <table width="600" height="600" border="0" cellpadding="0" cellspacing="0" bgcolor="#08336d">
\t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t <td width="300" height="600">
\t \t \t \t \t \t \t \t \t \t \t <img src="http://2a-web.com/email/test/images/img-01.jpg" width="300px" height="600px" border="0" style="display:block; line-height:0; font-size:0;"/>
\t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t <td width="300" height="600">
\t \t \t \t \t \t \t \t \t \t \t <table width="300" border="0" cellpadding="0" cellspacing="0">
\t \t \t \t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t <td width="300" height="300">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <img src="http://2a-web.com/email/test/images/img-02.jpg" width="300px" height="300px" border="0" style="display:block; line-height:0; font-size:0;"/>
\t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t <td width="300" height="300">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <table width="300" height="300" border="0" cellpadding="0" cellspacing="0">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <td width="150" height="300">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <img src="http://2a-web.com/email/test/images/img-03.jpg" width="150px" height="300px" border="0" style="display:block; line-height:0; font-size:0;"/>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <td width="150" height="300" bgcolor="#ffc33c">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <table width="150" border="0" cellpadding="0" cellspacing="0">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <td width="150" height="150">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <img src="http://2a-web.com/email/test/images/img-04.jpg" width="150px" height="150px" border="0" style="display:block; line-height:0; font-size:0;"/>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <td width="150" height="150" bgcolor="#16b512">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <table width="150" border="0" cellpadding="0" cellspacing="0">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <td width="75" height="150">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <img src="http://2a-web.com/email/test/images/img-05.jpg" width="75px" height="150px" border="0" style="display:block; line-height:0; font-size:0;"/>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <td width="75" height="150">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <img src="http://2a-web.com/email/test/images/img-06.jpg" width="75px" height="150px" border="0" style="display:block; line-height:0; font-size:0;"/>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </table>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </table>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t </table>
\t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t \t \t \t </table>
\t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t </table>
\t \t \t \t \t \t \t </td>
\t \t \t \t \t \t </tr>
\t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t <td align="center" style="padding: 40px 0 40px 0; font-size: 26px; font-weight: bold; font-family: Arial, sans-serif;">
\t \t \t \t \t \t \t \t Third Row
\t \t \t \t \t \t \t </td>
\t \t \t \t \t \t </tr>
\t \t \t \t \t </table>
\t \t \t \t </td>
\t \t \t </tr>
\t \t </table>
\t </body>
</html>, nasıl hücreler arasındaki boşluğu kaldırabilirim?
Yardımlarınız için teşekkür ederim.
'tablo {border-collapse: çöküş; MSO-masa-lspace: 0pt; MSO-masa-rspace: 0pt; } ' –