解决: 使用html2canvas和print-js打印组件时, 超出高度出现空白页

news/2024/7/5 5:19:54

如果所示:当我利用html2canvas转换成图片后, 然后使用print-js打印多张图片, 第一张会出现空白页

打印组件可参考这个: Vue-使用html2canvas和print-js打印组件

在这里插入图片描述

解决:  因为是使用html2canvas转换成图片后才打印的, 而图片是行内块级元素, 会有间隙, 所以被挤下去了, 因此可以给图片设置样式, 转换成块级元素

在这里插入图片描述
代码如下:

 printJS({
          printable: url,
          type: 'image',
          documentTitle: '打印图片',
          header: null,
            style:
              '@media print{ @page { size: A4; margin: 0; mso-header: none; mso-footer: none; } body{margin:0px  } img {display: block; margin: 0px;}}',
            base64: true
        })

效果图如下:
在这里插入图片描述


http://lihuaxi.xjx100.cn/news/1602562.html

相关文章

模拟器运行在AndroidStudio内部,设置其独立窗口显示

在窗口内部运行 设置成独立窗口 Android Studio->Settings或Preferences->Tools->Emulator->取消勾选Launch in the Running Devices tool window --->点击右下角的OK按钮 ---> 重启Android Studio 再次启动模拟器

项目环境搭建

注册中心网关配置 spring:cloud:gateway:globalcors:add-to-simple-url-handler-mapping: truecorsConfigurations:[/**]:allowedHeaders: "*"allowedOrigins: "*"allowedMethods:- GET- POST- DELETE- PUT- OPTIONroutes:# 平台管理- id: useruri: lb://…

电脑有录屏功能吗?让我来揭开谜底!

“电脑有录屏功能吗?今天孩子上网课的时候,老师叫录屏一些重要的知识点,但是他不会操作,就跑来问我,我也不是很清楚电脑怎么录屏,就想问问大家知道吗?” 电脑在我们的日常生活和工作中扮演着重…

打印字节流和字符流

打印字节流和字符流 printStream/ printWriter的构造器和方法都是一样的 package printfile;import java.io.FileOutputStream; import java.io.OutputStream; import java.io.PrintStream; import java.io.PrintWriter; import java.nio.charset.Charset;public class Prin…

在LangChain中使用Milvus + openai使用

Milvus(opens in a new tab) 是一个存储、索引和管理由深度神经网络和其他机器学习(ML)模型生成的大规模嵌入向量的数据库。 1.文档分割 from langchain.document_loaders import PyPDFLoader pdfloader PyPDFLoader("D:\py\LangChaindao\操作系统原理.pdf&…

[HNOI2003]激光炸弹---二维前缀和

题目描述 一种新型的激光炸弹,可以摧毁一个边长为 m 的正方形内的所有目标。现在地图上有 n 个目标,用整数 xi​ , yi​ 表示目标在地图上的位置,每个目标都有一个价值 vi​ .激光炸弹的投放是通过卫星定位的,但其有一个缺点&…

深度学习纯小白如何从零开始写第一篇论文?看完这篇豁然开朗!

📢前言 上个月小贾消失了一段时间,原因就是。。。 写论文去啦!!! 先拿我导的认可镇个楼: 本篇文章将分享我个人从迷茫地找方向→苦苦做了48次实验才高效涨点→写论文到头秃等等一系列真实经历&#xff0c…

当我们谈论量化时,我们在谈论什么?量化投资常见策略有哪些?| 融券T0和高频交易详解【邢不行】

最近关于量化的争议不断,很多人甚至建议取缔量化。 部分人认为量化以高频交易配合融券变相实现T0,赚走了市场所有的钱,有失公正。 高频交易大家都听过,即凭借程序在几秒甚至几毫秒内完成一笔交易,有人认为这对还在盯盘…