Question

使用源html / css文件查看代码时似乎没问题，但是当通过＆＃34; Webtools Toolbox＆＃34;（一个管理使用HTML / CSS的电子邮件+和外观设计的门户网站）发送时，电子邮件中的UL菜单中断。有没有办法使UL宽度缩放到电子邮件内容的任何参数？您可以在此处查看来源：https://illinois.edu/skinDesigner/preview/10087

<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0" width="100%" id="#">
<tr>
<td style="border: medium none;
font-size: 12px;
padding-bottom: 15px;
border-bottom: 1px solid #ddd;">
<ul style="list-style:none">

<li class="listle" ><a class="arttle"   
href="http://promisemagazine.org/category/longform/">LONGFORM</a> |</li>

<li class="listle" ><a class="arttle"  
href="http://promisemagazine.org/category/alumni/">ALUMNI</a> |</li>

<li class="listle" ><a class="arttle" 
href="http://promisemagazine.org/category/community/">COMMUNITY</a> |</li>

<li class="listle" ><a class="arttle" 
href="http://promisemagazine.org/category/giving/">GIVING</a> |</li>

<li class="listle" ><a class="arttle" 
href="http://promisemagazine.org/category/opinion/">OPINION</a> |</li>

<li class="listle" ><a class="arttle" 
href="http://promisemagazine.org/category/research/">RESEARCH</a>|</li>

<li class="listle" ><a class="arttle" 
href="http://promisemagazine.org/category/schools/">SCHOOLS</a></li>
</ul>
</td>
</tr>
</table>
/td>
</tr>

Answer 1

您可以在元素上设置类名，但没有CSS。电子邮件提供商会从您的文档中删除<head>和<body>标记，因此您在其中指定的任何标记都会丢失。

尝试使用<span>代替li作为菜单，或使用table作为菜单。表格将占用可用宽度的100％。

编辑：

另一种选择是简单地显示链接：

<td style="border: medium none;
font-size: 12px;
padding-bottom: 15px;
border-bottom: 1px solid #ddd;">

<a href="http://promisemagazine.org/category/longform/">LONGFORM</a> |
<a href="http://promisemagazine.org/category/alumni/">ALUMNI</a> |
<a href="http://promisemagazine.org/category/community/">COMMUNITY</a> |
<a href="http://promisemagazine.org/category/giving/">GIVING</a> |
<a href="http://promisemagazine.org/category/opinion/">OPINION</a> |
<a href="http://promisemagazine.org/category/research/">RESEARCH</a>|
<a href="http://promisemagazine.org/category/schools/">SCHOOLS</a>
</td>

Answer 2

我不完全确定我理解这个问题（你是否担心人们会改变他们的电子邮件窗口的大小，或者内容是否与桌子不符？）

假设您正在尝试将内容保留在方形窗口内，请尝试将其放在div中，然后调整div的宽度以适合您的表格，并显示inline block。我添加了保证金：0自动中心内容，如上面的格式。

代码示例：

<div style="width: x; height: y; display: inline-block; margin: 0 auto">

    <ul style="list-style:none">

       <li>
       <li>
       <li>
       <li>

    </ul>

</div>

Answer 3

我只会坚持使用HTML电子邮件的表格。源代码看起来很糟糕，但这是你唯一的选择。

HTML UL导航中断时事通讯？

3 个答案: