htmltable导出图片列宽

html-css014

htmltable导出图片列宽,第1张

在做项目过程中会用到导出功能,就是将HTML页面导出,生成为word文档,实际上就是导出table,会遇到某些图片超出整个word宽度的问题,怎么设置都不行,研究很久终于发现可以生效的css样式写法,如下,在行内对图片写样式:

<img width="556" style="width:100%max-width:100%" />

其中:width=“556”是写给word里的table识别用的,style的内容是写给html页面识别的,这样写就能控制导出图片宽度

utils - htmlToPdf.js

main.js

1、如果在多个页面使用,给函数定义一个参数,参数为要导出页面部分的id。

将 '#pdfDom' 替换为参数即可

2、将导出文件的名称也作为参数传入函数

此种方式也可用于vue,尝试后可行,需要调节部分参数,但毕竟不太合适。

jQuery不需要调节。

https://github.com/zhangshaoliang/downLoadPDF

vue方式

jQuery方式

目前项目使用的是前端加后端方式,前端提供模板,echarts图表的话需要转为base64发送给后台。后台使用iText。目前存在的问题是后台不支持css3语法,只支持到css2,所以复杂的样式页面显示错乱,考虑个别页面使用纯前端实现。

网站导航

把html导出成txt文件,然后再把txt文件导入Excel:

1、首先,打开excel,选择数据选项卡,自文本选项。

2、在弹出的资源管理器界面选择存放好的txt文件后,点击打开按钮。

3、此时弹出文本导入向导,由于我的数字是以空格为分隔字符的,所以我选择分隔符号,当然,如果你的文本是固定宽度,你可以选择第二个。然后点击下一步按钮。

4、勾选空格,检验预览数据是否和自己预想的一致。一致后继续点击下一步按钮。

5、查看预览效果。并选择列数据格式,此处没什么特别要求,建议选择常规,常规也是excel默认的格式。点击完成。

6、在弹出的对话框中,选中要导入的数据区域,此处我要导入到当前单元格,并且从a1单元格开始,因此我选择a1单元格,多余的数据会自动以此单元格向两边张开。点击确定按钮

我们的数据就算是完美的导入进来了。