伪类：empty 不适用于电子邮件模板答案

【问题标题】：Pseudoclass :empty not working for email templates伪类：empty 不适用于电子邮件模板
【发布时间】：2021-07-26 10:38:25
【问题描述】：

我正在创建电子邮件模板，我需要显示如下角色列表 -

列表是使用来自后端的动态参数创建的，并不是所有的角色都被显示，因此我最终得到了空的项目符号。

 <ul>
    <li>::admin_man</li>
    <li>::mem_man</li>
    <li>::term_mem</li>
    <li>::repo_man</li>
    <li>::new_comm</li>
  </ul>

我使用了伪类 :empty，甚至尝试使用具有空单元格属性的表格，但对于 Outlook-desktop 似乎没有任何效果。任何建议表示赞赏。请帮忙！！！

【问题讨论】：

:empty 绝对不是电子邮件客户端普遍支持的campaignmonitor.com/css/selectors/empty 你能有条件地渲染整个li吗？
我尝试使用javascript附加li标签，但后来发现outlook去掉了所有的javascript代码。
您使用的是任何模板语言/引擎，还是只使用 HTML？
它是带有内联 CSS 的纯 HTML
那么，除非您对原始方法的部分支持感到满意，否则它实际上并不是您可以控制的。不确定您的配置是什么，但也许您的后端可以用 ul 替换单个动态标签，其中包含作为列表项存在的所有参数，或者为所有不存在的行项提供一些默认值。但是电子邮件中的 HTML 不能有条件地以通用方式呈现。

标签： java html css email html-email

【解决方案1】：

伪类 :empty 没有得到很好的支持 https://www.campaignmonitor.com/css/selectors/empty/ (HT: @JHeth)

听起来您需要拥有每个 <li> 元素，但可以添加更多代码（不过您不清楚）。

要在 Outlook 上/以及任何地方隐藏内容，您需要一次性使用几种不同的方法，如下所示：

<li style="display:none;font-size:1px;color:#FFFFFF;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;margin:0;padding:0;" hidden>xyz</li>

那些不支持一种方法（例如 display:none）的电子邮件客户端将呈现一小段不可见的文本。

【讨论】：