Outlook.com에서 여분의 여백과 줄 간격을 이미지에 추가했습니다.

Question

무엇인가 분명하지 않지만 Outlook.com이 P 태그의 여백 및 줄 높이를 무시하고 있습니다. 편리하게은 모든 이미지를 줄 바꿈합니다. 바닥에이 불필요한 공간을 없애기위한 해결책은 무엇입니까? 헤더 스타일 태그에

<table width="196" cellspacing="0" cellpadding="0" border="0" style="border-collapse:collapse"> 
<tr> 
    <td valign="top" align="left" width="196" height="45"> 
    <table width="196" cellspacing="0" cellpadding="0" border="0" style="border-collapse:collapse"> 
     <tr> 
      <td style="font-size:0;line-height:0;border-collapse:collapse;border-bottom:1px solid #BBBBBB;padding:0;border-collapse:collapse;background:red;" valign="top" align="left" width="196"> 
      <a href="" style="font-size:0;line-height:0;" target="_blank"> 
       <img style="width:137px;height:44px;display:block;" src="" width="137" height="44" alt=""/></a> 
      </td> 
     </tr> 
     </table> 
    </td> 
    </tr></table> 

Answer 1

넣어이 다음 페이지 태그가 rendertime에 삽입되기 때문에

p {margin: 1em 0;} 

, 당신은 스타일 태그에 덮어 쓰기해야합니다.

Answer 2

Outlook에서 전자 메일을 작성하는 것은 고통 스럽습니다. 스타일 = "border-collapse : collapse; line-height : 0;을 사용하여 이미지 사이에 여분의 공간을 없앨 수있었습니다. TD 태그에서 모든 너비와 높이를 명시 적으로 설정합니다. style = "display : block;"을 넣는 것을 잊지 마십시오. 귀하의 IMG 태그에 모든 고객을 포괄합니다.

img { 
    line-height:100%; 
} 

사실

이 outlook.com은 다음으로 변환,하지만 작동합니다

<td width="400" height="100" style="border-collapse:collapse;line-height:0;"><img src="myimage.jpg" width="400" height="100" style="display:block; border:0; outline:none; text-decoration:none; -ms-interpolation-mode:bicubic;"></td>