☰

如何让 CSS 背景图像显示在 Word 打开的 HTML 文件中？

tag-icon • tag-icon images html format css microsoft-word
如何让 CSS 背景图像显示在 Word 打开的 HTML 文件中？

我的问题正是我想要的，但我也对在 Word 中打开 HTML 页面时如何保留样式的“一般规则”感兴趣。下面是关于我的上下文的更多信息。

在 Word 中打开的 HTML 文件<link ... />包含样式表等元素。所有内容在浏览器中正常显示。

到目前为止，我发现当基于具有多个类的元素时，具有多个类的元素不会保留其样式，也不会嵌套任何内容。

考虑一下：

<p class="class1">This <span class="class1 class2">is my</span> text.</p>

.class1 { color:green; }
.class2 { color:orange; }

.class1.class2 { color:red; }

.class1.class2,
.class1 { color:blue; }

结果是：

  1. p是绿色，因为它的第一个声明成立
  2. p不是蓝色，因为该声明是“无效”多类声明的一部分（！）
  3. span是橙色，因为它的第一个声明包含
  4. 与第 2 点一样，span由于“无效”的多类声明，它既不是红色，也不是蓝色

--

根据上述发现，我最终将元素包装在另一个元素中，始终使用单个标记类名并在此基础上成功地格式化事物。

请注意，使用 Javascript 操作元素、根据需要添加/删除额外的类名是可以的，Word 只对它尝试解析的 HTML 文件中的实际标记感兴趣。

我没有弄清楚的是，当 Word 打开 HTML 文件时，如何让相对链接的 CSS 背景图像显示出来。我通常使用快捷方式： background:transparent url(../img/icon-audio-16.gif) left top no-repeat;它不起作用（是的，检查了我的路径），但逐一分析也没有用：

background-color:transparent;
background-image:url(../img/icon-audio-16.gif);
background-position:left top;
background-repeat:no-repeat;

是的...

答案1

对于任何感兴趣的人而言，这似乎总结了一切： http://msdn.microsoft.com/en-us/library/aa338201(office.12).aspx

相关内容