css & no margin & print pdf
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的更多相关文章
- print pdf bug & DOCTYPE
print pdf bug & DOCTYPE OK with <!DOCTYPE html> <!DOCTYPE html> <html lang=" ...
- CSS中margin和padding的区别
在CSS中margin是指从自身边框到另一个容器边框之间的距离,就是容器外距离.在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离. 下面讲解 padding和ma ...
- CSS中margin边界叠加问题及解决方案
你对CSS的margin边界叠加的概念是否了解,这里和大家分享一下,当一个元素出现在另一个元素上面时,第一个元素的底边界与第二个元素的顶边界发生叠加. CSS的margin边界叠加深度剖析 边界叠加简 ...
- 怎样使用 css 的@media print控制打印
怎样使用 css 的@media print控制打印? <HTML> <HEAD> <TITLE> New Document </TITLE> < ...
- CSS中margin边界叠加问题及解决方案(转)
边界叠加简介 边界叠加是一个相当简单的概念.但是,在实践中对网页进行布局时,它会造成许多混淆.简单地说,当两个垂直边界相遇时,它们将形成一个边界.这个边界的高度等于两个发生叠加的边界的高度中的较大者. ...
- CSS中margin属性
css中margin块级元素的垂直相邻外边距会合并,比如 方框的上下外边距并不是2px,而是合并为1px了. 设置float属性就可以避免这种同级元素边距合并
- 零点起飞学HTML+CSS (顼宇峰) PDF扫描版
零点起飞学HTML+CSS系统地介绍了网站制作中各种常用的HTML标签和CSS属性,以及网站各个部分和各种布局的实现方法,还提供了大量实例来引导读者学习,力求让读者获得真正实用的知识.本书涉及面广,从 ...
- CSS Grid & Flex poster PDF 海报定制
CSS Grid & Flex poster PDF 海报定制 CSS 手工实现 导出 SVG / PNG 导出 PDF 打印,定制海报 refs https://css-tricks.com ...
- CSS的margin塌陷(collapse)
<!DOCTYPEHTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head&g ...
随机推荐
- Flask-SQLAlchemy - 不使用外键连表查询。记得常回来看我
前言 相比于 Django 的 ORM ,SQLAlchemy "不依靠外键进行跨表联查" 的解决方案就比较多. 没啥好说的,只能怪自己学艺不精.. _(:з」∠)_ 解决办法 ...
- (快排)51NOD 1018 排序
给出N个整数,对着N个整数进行排序 Input 第1行:整数的数量N(1 <= N <= 50000) 第2 - N + 1行:待排序的整数(-10^9 <= A[i] < ...
- Hexo 添加Live2D看板娘
title: Hexo 添加 Live2D看板娘 二次元什么的最喜欢了[大好きです] 准备 项目地址 live2d模型 部分模型预览 开始 首先进入Hexo博客根目录安装live2d插件 $ npm ...
- easyui-datebox 年月视图显示
//年月视图做法 $('#startYearDate').datebox({ onShowPanel: function () { //显示日趋选择对象后再触发弹出月份层的事件,初始化时没有生成月份层 ...
- 【杂文】C++头文件加速
[杂文]C++头文件加速 骚年,冲钱送开挂哦,可以助你超神于OI战场 如果你发现你的暴力超时了的话,可以尝试用一下头文件加速,说不定就过了呢! #pragma once//只编译一次 #pragma ...
- c++ rand && srand 函数
RAND: 结构:rand() 注:rand()不需要参数,它会根据种子返回一个从0到最大随机数的任意整数. 作用:生成一个随机数. 头文件:#include <cstdlib> ...
- C# 堆VS栈 值类型VS引用类型
最近博客园上连续出现了几篇关于堆VS栈 值类型VS引用类型的文章. 一个是关于C# 堆VS栈的,深入浅出,动图清晰明了,链接如下 C#堆栈对比(Part One) C#堆栈对比(Part Two) C ...
- C# 访问mongodb数据库
1.引用四个mongodb动态库MongoDB.Bson.dll,MongoDB.Driver.Core.dll,MongoDB.Driver.dll,MongoDB.Driver.Legacy.dl ...
- Android 你知道界面布局嵌套多少层之后会Crash吗
我们先放一张Hierarchy Viewer的图:(模拟器Android4.4) 看到数字6了吗,那个RelativeLayout是MainActivity的根ViewGroup, 而在Relativ ...
- mongo 3.4分片集群系列之五:详解平衡器
这个系列大致想跟大家分享以下篇章: 1.mongo 3.4分片集群系列之一:浅谈分片集群 2.mongo 3.4分片集群系列之二:搭建分片集群--哈希分片 3.mongo 3.4分片集群系列之三:搭建 ...