我正在寻找由HTML生成的Microsoft Word文档的示例.它应该包含页眉,页脚和水印.
我根据这些出色的stackoverflow资源从一些HTML构建了一个word文档:
对于那些即将尝试它的人来说,为自己做一些痛苦做好准备,因为Word至少可以解释它与CSS一起使用的内容.如果你想要列,你真的需要回到使用表格来解决问题.
我一直无法正确调整图像大小 - 用户上传的图像将在此Word文档中使用,我想根据'height'属性调整大小 - 高度为50px然后相应地缩放宽度.
似乎没有关于如何在网络上的任何地方执行此操作的文档.
我还使用了一些html2canvas代码将漂亮的(基于CSS的)条形图转换为图像,然后根据优秀的http://www.kubilayerdogan.net/?p直接在word文档中使用= 304.
这个图像打印效果不好,所以我打算在运行html2canvas代码之前在屏幕上(隐藏在内存中)(使用jQuery)使源HTML更大 - 这样我就可以拥有更大的图像,我可以然后缩小尺寸并获得更高的DPI数.
首先,我了解到CSS宽度和高度对Word中的图像没有影响.同样,以下内容不起作用.
<img class="cobrandedlogo" src="' . $logourl . '" height="50px" />';
Run Code Online (Sandbox Code Playgroud)
但我已经发现,使用"点"的工作原理是这样:
<img class="cobrandedlogo" src="' . $logourl . '" height="50" />';
Run Code Online (Sandbox Code Playgroud)
但是这会产生非常拉伸的图像(当然取决于源材料).我希望它根据原始图像进行缩放.
我正在使用PHP.
我发现这篇SO文章似乎有所帮助:计算图像大小比例以调整大小
这是我一直在使用的一些代码:
jQuery代码生成div的图像,稍微修改显示的HTML并将其提交到PHP文件:
var wordreport = jQuery('#container').clone();
jQuery(wordreport).find('#stats').html('<img src="http://improvedemployees.com/assets/teamstats/' + jQuery('#imgname').val() + '" />');
jQuery(wordreport).find('.columncontainer').each(function() {
jQuery(this).children().wrapAll('<table><tr>');
});
// these were 3 columns on the screen - converted to a table and …Run Code Online (Sandbox Code Playgroud)