调整A4大小的html页面

时间:2017-09-17 09:17:04

标签: html css

我想在A4尺寸纸张上打印html页面。我用这个代码: CSS

body {
  background: rgb(204,204,204); 
}
page {
  background: white;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.5cm;
  box-shadow: 0 0 0.5cm rgba(0,0,0,0.5);
}
page[size="A4"] {  
  width: 21cm;
  height: 29.7cm; 
}
page[size="A4"][layout="portrait"] {
  width: 29.7cm;
  height: 21cm;  
}
page[size="A3"] {
  width: 29.7cm;
  height: 42cm;
}
page[size="A3"][layout="portrait"] {
  width: 42cm;
  height: 29.7cm;  
}
page[size="A5"] {
  width: 14.8cm;
  height: 21cm;
}
page[size="A5"][layout="portrait"] {
  width: 21cm;
  height: 14.8cm;  
}
@media print {
  body, page {
    margin: 0;
    box-shadow: 0;
  }
}

HTML

<page size="A4"></page>

但我没有期待的结果。从文本中打印出一个大的灰色轮廓。此外,我希望能够打印我的页面垂直或horizo​​ntialm

2 个答案:

答案 0 :(得分:1)

body {
  background: rgb(204,204,204);
  margin: 0;
  padding: 0; 
}

答案 1 :(得分:0)

A4尺寸 210x297mm ,您可以使用此功能:

html,body{
        height:297mm;
        width:210mm;
    }