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. RabbitMq安装成功后执行命令报错(Error: unable to connect to node 'rabbit@DESKTOP-LPKSION': nodedown)

    我们直接来看解决方案吧.首先打开服务,找到RabbitMq服务. 双击打开后选择登陆选项卡: 点选此账户,输入你计算机的登录名称.点击浏览: 在这里输入你的用户名,点检索: 这里的密码输入你电脑开机登 ...

  2. 构造 Codeforces Round #135 (Div. 2) B. Special Offer! Super Price 999 Bourles!

    题目传送门 /* 构造:从大到小构造,每一次都把最后不是9的变为9,p - p MOD 10^k - 1,直到小于最小值. 另外,最多len-1次循环 */ #include <cstdio&g ...

  3. 题解报告:poj 1426 Find The Multiple(bfs、dfs)

    Description Given a positive integer n, write a program to find out a nonzero multiple m of n whose ...

  4. 我要上google

    我要上google 一.下载google浏览器(百度下载) 二.获取和运行xx-net 1.https://github.com/XX-net/XX-Net 2.解压下载的xx-net,运行文件夹中的 ...

  5. (三)Mybatis总结之动态sql

    动态sql 为何需要动态sql?因为简单的sql语句已经不能满足复杂的业务需求 动态sql相当于sql语句拼接 1.if语句 if语句:判断,如果执行多条件查询,如果中间某个条件变量为空,就跳过当前判 ...

  6. Codewars练习Python

    计算一个数组的中间数,数的两边和相等,并返回index值 如:数组[1,2,3,4,6] 返回3(数组序号从0开始) def find_even_index(arr): ""&qu ...

  7. [算法天天练] - C语言实现约瑟夫环(2)

    Linux下 #include <stdlib.h>#include <stdio.h> int main(){ int n,m,i,s = 0; printf("E ...

  8. 关于百度地图导航AndroidSDK的初始化问题

    使用百度地图有一段时间了,导航是一个一直困扰我的问题.今天刚发现百度地图的导航SDK并不是对Android6.0版本不兼容.而是对某一部分手机不兼容,准确的说是对X64或X86的cpu不兼容.下载百度 ...

  9. [Windows Server 2012] 初识Windows Server 2012

    ★ 欢迎来到[护卫神·V课堂],网站地址:http://v.huweishen.com★ 护卫神·V课堂 是护卫神旗下专业提供服务器教学视频的网站,每周更新视频.★ 本节我们将带领大家:初次见识Win ...

  10. POJ_2536_Gopher II

    题意:n只地鼠,m个地鼠洞,地鼠必须以v的速度在s秒内钻进洞且每个洞仅能容纳一只地鼠,问最少有几只地鼠会被老鹰吃掉. 分析:最大匹配问题,将s秒内地鼠能够跑到的洞与该地鼠连成一条边,在最后得到的图中使 ...