css & no margin & print pdf

no header & no footer

https://stackoverflow.com/questions/46077392/additional-options-in-chrome-headless-print-to-pdf

@page {
margin: 0;
} @page {
margin-top: 0;
} @page {
margin-bottom: 0;
}

media & print.css


url = `http://localhost:9000/api/render`,
obj = {
url: "http://10.1.5.202/stock/f9/fastview/index.html",
output: "pdf",
scrollPage: true,
pdf: {
landscape: true,
},
emulateScreenMedia: true,
// output: "screenshot",
ignoreHttpsErrors: true,
}; fetch(url,
{
method: "POST",
mode: "cors",
headers: {
"Content-Type": "application/json; charset=utf-8",
},
body: JSON.stringify(obj),
})
.then(res => res.blob())
.then(blob => {
// base64
let objectURL = URL.createObjectURL(blob);
let a = document.createElement(`a`);
a.href = objectURL;
let title = `test`;
// png
// a.setAttribute(`download`, `${title}.png`);
// pdf
a.setAttribute(`download`, `${title}.pdf`);
a.click();
})
.catch((err) => {
console.log(`There has been a problem with your fetch operation: `, err);
});

css & no margin & print pdf的更多相关文章

  1. print pdf bug & DOCTYPE

    print pdf bug & DOCTYPE OK with <!DOCTYPE html> <!DOCTYPE html> <html lang=" ...

  2. CSS中margin和padding的区别

    在CSS中margin是指从自身边框到另一个容器边框之间的距离,就是容器外距离.在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离. 下面讲解 padding和ma ...

  3. CSS中margin边界叠加问题及解决方案

    你对CSS的margin边界叠加的概念是否了解,这里和大家分享一下,当一个元素出现在另一个元素上面时,第一个元素的底边界与第二个元素的顶边界发生叠加. CSS的margin边界叠加深度剖析 边界叠加简 ...

  4. 怎样使用 css 的@media print控制打印

    怎样使用 css 的@media print控制打印? <HTML> <HEAD> <TITLE> New Document </TITLE> < ...

  5. CSS中margin边界叠加问题及解决方案(转)

    边界叠加简介 边界叠加是一个相当简单的概念.但是,在实践中对网页进行布局时,它会造成许多混淆.简单地说,当两个垂直边界相遇时,它们将形成一个边界.这个边界的高度等于两个发生叠加的边界的高度中的较大者. ...

  6. CSS中margin属性

    css中margin块级元素的垂直相邻外边距会合并,比如 方框的上下外边距并不是2px,而是合并为1px了. 设置float属性就可以避免这种同级元素边距合并

  7. 零点起飞学HTML+CSS (顼宇峰) PDF扫描版

    零点起飞学HTML+CSS系统地介绍了网站制作中各种常用的HTML标签和CSS属性,以及网站各个部分和各种布局的实现方法,还提供了大量实例来引导读者学习,力求让读者获得真正实用的知识.本书涉及面广,从 ...

  8. CSS Grid & Flex poster PDF 海报定制

    CSS Grid & Flex poster PDF 海报定制 CSS 手工实现 导出 SVG / PNG 导出 PDF 打印,定制海报 refs https://css-tricks.com ...

  9. CSS的margin塌陷(collapse)

    <!DOCTYPEHTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head&g ...

随机推荐

  1. 【WIP_S4】栈

    创建: 2018/01/15 更新: 2018/01/24 更改标题 [[WIP_S3]堆] => [[WIP_S4]堆] 继续添加内容 更新: 2018/05/13 更改标题  [[WIP_S ...

  2. bzoj 1718: [Usaco2006 Jan] Redundant Paths 分离的路径【tarjan】

    首先来分析一下,这是一张无向图,要求没有两条路联通的点对个数 有两条路连通,无向图,也就是说,问题转化为不在一个点双连通分量里的点对个数 tarjan即可,和求scc还不太一样-- #include& ...

  3. mybatis时间查询小技巧

     网上大多数使用mybatis查询的时候都是把时间转换成Date使用的,其实这里时可以直接使用String的,比如 <if test="startTime != null and st ...

  4. gitlab&Jenkins 详细介绍及其应用

    第1章 gitlab 1.1 系统环境 [root@jenkins ~]# cat  /etc/redhat-release CentOS Linux release 7.2.1511 (Core) ...

  5. Java常见面试问题: equals()与hashCode()的使用

    目录 1 equals()与'=='的区别 2 equals()方法的重写规则 3 为什么重写equals()的同时还需要重写hashCode() 4 JDK 7中对hashCode()方法的改进 5 ...

  6. IIS配置负载均衡

    一.下载Nginx安装包 二.修改nginx.conf文件信息 如图: 三.重新加载Nginx (nginx -s reload) 启动Nginx: start nginx 停止Nginx:nginx ...

  7. js数组的各种方法

    1.检测数组 ①Instanceof: if(value instanceof Array){ } 它假定只有一个全局执行环境,若网页中包含多个框架,则存在多个不同的全局执行环境,则Instanceo ...

  8. HP M177打印机驱动安装问题与解决

    问题描述 采购HP Color LaserJet Pro MFP M177 PCLmS一台,采用局域网WIFI网络与办公室各电脑连接.安装打印机自带光盘驱动,发现有些电脑安装驱动失败,提示“出现严重错 ...

  9. Linux 软件编译、安装、删除

    本文学习内容 手动安装软件 手动安装下载源码的软件 源码编译3步骤 deb包-包依赖管理 dekg -l 查看所以安装deb的包 apt-get仓库安装(自动处理依赖问题) 640?wx_fmt=gi ...

  10. 梦想CAD控件文字COM接口知识点

    一.参数绘制文字 在CAD设计时,需要绘制文字,用户可以设置设置绘制文字的高度等属性. 主要用到函数说明: _DMxDrawX::DrawText 绘制一个单行文字.详细说明如下: 参数 说明 DOU ...