是否有可能使一个HTML页面的行为，例如，像一个a4大小的页面在MS Word?
实际上，我希望能够在浏览器中显示HTML页面，并以A4大小页面的尺寸概述内容。
为了简单起见，我假设HTML页面只包含文本(没有图像等)，例如，不会有<br>标记。
另外，当HTML页面被打印出来时，它将显示为a4大小的纸质页面。
当前回答
我使用HTML生成报告，在真实的纸张上正确地打印出真实大小。
如果你小心地使用mm作为CSS文件中的单位，你应该是OK的，至少对于单页。不过，人们可以通过改变浏览器中的打印缩放来搞砸你。
我似乎记得我所做的每一件事都是单页的，所以我不必担心分页——那可能要困难得多。
其他回答
我使用HTML生成报告，在真实的纸张上正确地打印出真实大小。
如果你小心地使用mm作为CSS文件中的单位，你应该是OK的，至少对于单页。不过，人们可以通过改变浏览器中的打印缩放来搞砸你。
我似乎记得我所做的每一件事都是单页的，所以我不必担心分页——那可能要困难得多。
强制web浏览器以与A4相同的像素尺寸显示页面是相当容易的。然而，在渲染时可能会有一些怪癖。
假设你的显示器显示72 dpi，你可以添加如下内容:
<!DOCTYPE html>
<html>
<head>
<style>
body {
height: 842px;
width: 595px;
/* to centre page on screen*/
margin-left: auto;
margin-right: auto;
}
</style>
</head>
<body>
</body>
</html>
A4尺寸为210x297mm
所以你可以用CSS设置HTML页面来适应这些大小:
html,body{
height:297mm;
width:210mm;
}
为每一页创建节，并使用下面的代码来调整页边距、高度和宽度。
如果你打印的是A4尺寸。
然后用户
Size : 8.27in and 11.69 inches
@page Section1 {
size: 8.27in 11.69in;
margin: .5in .5in .5in .5in;
mso-header-margin: .5in;
mso-footer-margin: .5in;
mso-paper-source: 0;
}
div.Section1 {
page: Section1;
}
然后创建一个包含所有内容的div。
<div class="Section1">
type your content here...
</div>
or
@media print {
.page-break {
height: 0;
page-break-before: always;
margin: 0;
border-top: none;
}
}
body, p, a,
span, td {
font-size: 9pt;
font-family: Arial, Helvetica, sans-serif;
}
body {
margin-left: 2em;
margin-right: 2em;
}
.page {
height: 947px;
padding-top: 5px;
page-break-after: always;
font-family: Arial, Helvetica, sans-serif;
position: relative;
border-bottom: 1px solid #000;
}
从技术上讲，您可以这样做，但是要让所有浏览器打印出与屏幕上显示的一模一样的页面，需要做很多工作。而且，大多数浏览器强制在打印结果上输入URL、打印日期和页码，这并不总是理想的。这不能被改变或禁用。
相反，我建议根据屏幕上的内容创建一个PDF，并将PDF提供给下载和/或打印。虽然大多数可用的PDF库都是付费的，但也有一些免费的替代方案可用于创建基本的PDF。
