Question

我用html制作了一个内联css的新闻通讯，它的工作正常，但是当我们在outlook中看到它看起来不太好并且有一些css缺失时。所有其他像gmail一样正常工作。

以下是该html模板的链接：

http://fashionfad.in/newsletter/april-29/

Answer 1

Outlook是对css样式支持最少的邮件服务之一。 Here您有不同邮件客户端支持的样式列表。我无法找到最小高度支撑，但从我看到的情况来看，也不支持最小宽度和最大宽度。

Answer 2

不支持最小高度。而是将表格单元格height=""设置为最小值，如果需要，它将拉伸更大：

<!-- this has height set to 100, but stretches larger vertically -->
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
  <tr>
    <td valign="top" height="100">
      Table 1<br>...<br>...<br>...<br>...<br>...<br>...<br>...<br>...<br>...<br>...
    </td>
  </tr>
</table>

<br><br>

<!-- this has height set to 100, faking "min-height" -->
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
  <tr>
    <td valign="top" height="100">
      Table 1<br>...
    </td>
  </tr>
</table>

或者，如果您对表格嵌套很聪明，则可以伪造最小高度。如果您不想在单元格上设置特定高度，则允许通过内容控制高度，这样做会更好：

<!-- this has no "min-height" -->
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td valign="top">
      <table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
        <tr>
          <td valign="top">
            Table 1<br>...<br>...<br>...<br>...<br>...<br>...<br>...<br>...
          </td>
        </tr>
      </table>
    </td>
    <td valign="top">
      <table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#999999">
        <tr>
          <td valign="top">
            Table 2<br>...<br>...<br>...<br>...
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

<br><br>

<!-- this fakes "min-height" -->
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td valign="top">
      <table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
        <tr>
          <td valign="top">
            Table 1<br>...<br>...<br>...<br>...<br>...<br>...<br>...<br>...
          </td>
        </tr>
      </table>
    </td>
    <td valign="top" bgcolor="#999999">
      Table 2<br>...<br>...<br>...<br>...
    </td>
  </tr>
</table>

min-height css在outlook 2007时事通讯中不起作用

2 个答案: