html 打印 a4 像素,精确打印A4纸张排版HTML

发表于 2020-03-03 09:59:26 by 月小升

HTML可以精确的设置

A4纸

body

{

margin: 0;

padding: 0;

background-color: #FAFAFA;

font: 12pt "Tahoma";

}

*

{

box-sizing: border-box;

-moz-box-sizing: border-box;

}

.page

{

width: 21cm;

min-height: 29.7cm;

padding: 2cm;

margin: 1cm auto;

border: 1px #D3D3D3 solid;

border-radius: 5px;

background: white;

box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);

}

.subpage

{

padding: 1cm;

border: 5px red solid;

height: 256mm;

outline: 2cm #FFEAEA solid;

}

@page

{

size: A4;

margin: 0;

}

@media print

{

.page

{

margin: 0;

border: initial;

border-radius: initial;

width: initial;

min-height: initial;

box-shadow: initial;

background: initial;

page-break-after: always;

}

}

Page 1/2

Page 2/2

打印预览效果

暂无相关文章

This entry was posted in WEB前端 and tagged 打印. Bookmark the permalink.

月小升QQ 2651044202, 技术交流QQ群 178491360

首发地址：月小升博客 – https://java-er.com/blog/print-html-cm/

无特殊说明，文章均为月小升原创，欢迎转载，转载请注明本文地址，谢谢