div 设置a4大小_将div拉伸到A4大小

I have the following function which works great.

function printDiv(printpage)

{

var headstr = "

";

var newstr = document.all.item(printpage).innerHTML;

var oldstr = document.body.innerHTML;

document.body.innerHTML = headstr+newstr;

window.print();

document.body.innerHTML = oldstr;

return false;

}

However my div is about half of the paper size. Is there a way to make my div stretch to a full paper size when the function is called?

解决方案

You can set the div size by css to fit it in a A4 size paper

CSS:

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: 237mm;

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;

}

}

HTML:

Page 1/2

Page 2/2