word文档在html页面展示的几种解决方案

1、实现富文本中样式代码的分离；

2、保留CSS样式；

其实以上两个步骤是相互矛盾的处理过程，无法通过Jacob或POI组件加正则表达式过滤解决，于是进行了以下步骤的实验：

1、首先创建了一个空白word文档，格式（office 2003格式或office 2007格式）不限；

2、将word格式保存为html格式，通过Edit Plus打开，发现代码中使用了office的命名空间，同时使用了office命名空间的标签定义了CSS样式，自己测试了一下，将生成的html文件头和尾拷贝出来：代码如下：

以上HTML头是office的命名空间定义。

3、将使用富文本代码粘贴到红色标识的<!-- 富文本代码区 -->中，并以doc或docx格式保存文件；

4、大功告成，打开文件时，Word将会以“Web版视图”完美显示了富文本样式，成功解决了富文本代码中样式代码，并同时保留了格式；

目前研究的仅能保存文字，未处理有图片的代码，朋友们可以再研究一下带图片的富文本代码的转换；

参考富文本：LayaAir下 HtmlDivElement的使用汇总 富文本HtmlDivElement的使用 HTML文本1.简单的Html属性设置：Bold、Font、FontSize、Color、下划线 示例如下： 2、获取Html文本的实际内容、获取html文本的实际宽高（contextWidth、contextHeight） 示例如下： 3、设置文本的水平居中对齐(align需要和width配合使用)，换行（ 换行需要有行高）、空格（ ；） 【注意：目前不支持文本的垂直居中对齐，开发可以将（图片的高度-文本的高度）/2的值赋给文本的Y值，进行垂直居中对齐的替代设置】 示例如下： 4、实现超链接 示例如下： 5、实现html页面跳转 示例如下： 6、简单的图片显示 示例如下： 7、追加文本内容appendHtml 示例如下： 8、解决IOS手机上英文字母显示偏下的问题 在style样式中加垂直向上对齐valign：top属性 示例如下： 总结：以上的方法仅供参考，某些方法只是实现方式的一种，开发者也可以通过其他方式进行设置，如果有哪些方法没有涉及到的，欢迎开发者提出来，我们会陆续进行补充！ 9.换行 设置style.width会自动换行，手动换行需要在span标签后添加br 10.描边 参考 HTMLDivElement文本字体描边怎么弄呢11.斜体 不支持 12.滚动条 参考 建议官方针对HtmlDIVElement出和TextArea相关的功能htmldivelement组件是没有滚动条的，它不具备输入功能，不能编辑，有点类似flash的htmltext文本可以实现富文本图文混排。textarea是支持滚动条的文本输入框，内容本身不能存在图片，不支持文本局部链接。 可以把htmldivelement放到一个容器里，然后把这个容器放到panel里，panel是支持滚动条的，这样可以通过内容的填充显示出滚动条！ 13.参考示例

---