css - 打印确切尺寸

Question

我需要在常规A4页面上打印网页。

打印结果应该是20厘米x 20厘米（无论它在纸上的位置）。

我有这个HTML页面：

＆＃13;

＆＃13;

body {
  -webkit-print-color-adjust: exact;
  height: 20cm;
  width: 20cm;
  margin: 0;
  padding: 0
}

img {
  height: 20cm;
  width: 20cm;
  position: absolute;
  top: 0;
  left: 0;
}

h1 {
  font-size: 0.9cm;
  position: relative;
  top: 1cm;
  text-align: center;
  width: 70%;
  margin: 0 auto;
  color: #ffde00;
}

@media print {
  body {
    height: 20cm;
    width: 20cm;
  }
}

＆＃13;

<img src="background.png">
<h1>My Example Text</h1>

＆＃13;

＆＃13;

＆＃13;

当我打印此页面时（在常规的lasterJet A4打印机上），我在纸张上的结果大约是18.9厘米。

我怎样才能准确地做到20厘米？

Answer 1

要设置打印区域，可以使用@media print 一个例子：

/* style sheet for “letter” printing */
@media print and (width: 1.5in) and (height: 1in) {
@page {
margin: 1in;
}
}