html - 打印页面底部带有图像的整页网页

Question

我正在尝试打印整页(无边距)网页，页面底部有图片。但是，由于底部低于页面底部，因此未打印图片。我需要更改什么才能打印图片？ Demo

HTML:

<div class="page" id="container" style="position:absolute;top:0;left:0;overflow: hidden;width:210mm;height:297mm;">
<div style="position: absolute; top: 130mm; left: 50mm;">
 <img src="http://upload.wikimedia.org/wikipedia/commons/b/bf/Bucephala-albeola-010.jpg" style="width: 100mm; height: 100mm;"></img>
</div>
<div style="position: absolute; top: 230mm; left: 50mm;">
 <img src="http://upload.wikimedia.org/wikipedia/commons/b/bf/Bucephala-albeola-010.jpg" style="width: 100mm; height: 100mm;"/>
</div>
</div>

CSS:

body {
    margin: 0;
    padding: 0;
}

.page {
    width: 21cm;
    min-height: 29.7cm;
}

Answer 1

解决方案是 img 元素的位置:

position: absolute;
top: 0;
left: 0;

这样:

<div style="position: absolute; top: 230mm; left: 50mm;">
  <img src="http://upload.wikimedia.org/wikipedia/commons/b/bf/Bucephala-albeola-010.jpg" style="width: 100mm; height: 100mm;position:absolute;top:0;left:0;"/>
</div>

Demo