<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>A4紙網頁打印</title>
<!-- 去除頁眉頁腳 -->
<style media="print">
@page {
/* auto is the initial value */
size: auto;
/* this affects the margin in the printer settings */
margin: 5mm;
}
</style>
</head>
<!--
在公制長度單位與屏幕分辨率進行換算時,必須用到一個DPI(Dot Per Inch)指標。
經過我仔細的測試,發現了網頁打印中,默認採用的是96dpi,並非傳聞的72dpi
A4紙張的尺寸是210×297mm,按1英寸=25.41mm換算,即8.264×11.688英寸
所以,A4紙96dpi下的分辨率是794×1123,這就是我們在製作網頁的時候需要的象素。
但是打印機是無法滿幅打印的,總要有頁邊距,所以我們在製作網頁的時候必須減去頁邊距。
A4紙的尺寸:210×297mm
A3紙的尺寸:297×420mm
-->
<body>
<!-- 打印頁邊距設定爲 0mm 時,網頁內最大元素的分辨率:794×1123 -->
<div style="width:794px;height:1123px;border:1px solid #000000;margin:0 auto;page-break-after:always;"></div>
<!-- 打印頁邊距設定爲 5mm 時,網頁內最大元素的分辨率:756×1086 -->
<div style="width:756px;height:1086px;border:1px solid #000000;margin:0 auto;page-break-after:always;"></div>
<!-- 打印頁邊距設定爲 19.05mm 時,網頁內最大元素的分辨率:649×978 -->
<div style="width:649px;height:978px;border:1px solid #000000;margin:0 auto;"></div>
</body>
</html>