css - 纵向模式下的媒体打印问题

Question

我有这张表格，我打印出来是为了完成我的工作。

现在，问题是，在纵向模式下，它被最小化了，我的意思是它看起来很小，就像 A4 Letter 的一半页面，而在横向模式下它看起来还不错。

这是我的媒体打印 css：

@media print  {
textarea{
        border:none;
    }
textarea#difekti {
padding-bottom:40px;
border:none;
    }
#menu-home { display:none }
#status-print { display:none }
#submit-f {display:none};
#MainContent {
    display: block;

}
#tab1 table, td, th {
  border: 1px solid red;   
}

#tab1 thead {
  float: left;   
}


#tab1 thead th {
  display: block;   
  background: yellow;
}

#tab1 tbody {
  float: right;   
}
#programi {
    display:none;
}
#kursor {
    display:none;
}
#adresa { }
* {position:static !important;}

}

有什么建议吗？此外，我也有 IE 的问题。我可以为 IE 创建额外的媒体打印吗？谢谢

Answer 1

@page CSS at-rule 用于在打印文档时修改某些 CSS 属性。您不能使用 @page 更改所有 CSS 属性。您只能更改文档的页边距、孤立点、窗口和分页符。更改任何其他 CSS 属性的尝试将被忽略。

@page { size:5.5in 10in; margin: 1cm }

Answer 2

您应该将其更改为单独的 CSS 文件，并使用任何 CSS 链接底部的media="print"将其链接到您的 HTML 文档。

<link rel="stylesheet" type="text/css" media="print" href="path/to/your/css" />

这也将帮助您避免 IE 的问题。

Answer 3

@media print and (orientation: portrait) { 这里的样式 }

@media print and (orientation: Landscape) {这里的样式}