css - 多个 css 类不起作用

标签 css outlook apache-poi openxml outlook-2010

我正在将 docx 转换为 html 格式(使用 apache poi)并将其作为电子邮件发送。

生成的 html 片段看起来像这样

<html>
<head>
	....
	<style>

		span.Normal{
			font-family: 'Arial';font-size: 9.0pt;
		}

		span.Title{
			font-family: 'Cambria';font-size: 28.0pt;color: #000000;
		}

		span.MySubtitle{
			font-family: 'Arial';font-size: 18.0pt;color: #000000;
		}

		span.MyTitle{
			font-family: 'Arial';font-size: 22.0pt;font-weight: bold;color: #000000;
		}

	...
	</style>
</head>
<body> 
....

	<p class="Normal Title MyTitle">
		<span id="_GoBack">
			<span class="Normal Title MyTitle">Welcome Message</span>
			<span class="Normal Title MyTitle"> </span>
			<span class="Normal Title MyTitle">Username</span>
		</p>
		<p class="Normal Title MySubtitle">
			<span class="Normal Title MySubtitle">Issues and Solutions</span>
		</p>

	...
</body>
</html>

Outlook 客户端无法识别多个 css 类。它只渲染第一个 css 类“Normal”而忽略其余部分。但我的原始格式(在 docx 中)存在于“MyTitle”和“MySubTitle”类中。

Outlook 是否支持多个 css?有没有一种方法可以控制多个 css 生成。

最佳答案

我自己刚刚发现了这个问题。

看起来 Outlook 只采用 class 属性中列出的第一个类,忽略其他所有内容。

样式表:

<!--[if gte mso 9]>
<style type="text/css">
.red {
    color: red;
}
.large {
    font-size: 72px;
}
</style>
<![endif]-->

标记:

<div class="red">
    THIS SHOULD BE RED IN OUTLOOK
</div>
<div class="large">
    THIS SHOULD BE LARGE IN OUTLOOK
</div>
<div class="red large">
    THIS SHOULD BE RED AND LARGE IN OUTLOOK
</div>
<div class="large red">
    THIS SHOULD BE RED AND LARGE IN OUTLOOK
</div>

结果:

Screenshot demonstrating that Outlook ignores all classes except the first one when applying stylesheet

据我所知,所有版本的 Outlook 都受到影响。包括较新的。

我已经向 hteumeuleu/email-bugs 提交了一份错误报告,记录了这个怪癖:

https://github.com/hteumeuleu/email-bugs/issues/117

关于css - 多个 css 类不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39164497/

相关文章:

html - 无法将无序列表与 'flex-column' 对齐

outlook - 我们如何强制将邮箱项目持久保存到 EWS?

regex - Outlook 2007 中的正则表达式规则?

ms-word - 如何更改 Apache word poi (XWPF) 中的表方向?

javascript - Popover 组件 - onExited 回调不起作用, Material ui

html - 将子菜单(下拉)方向从垂直更改为水平

javascript - 检查特定输入后如何使标签更改属性?

vba - 从 PST 文件中移动所有项目

java - poi错误日期公式值计算

java - java中使用POI读取Excel