Question

我想将margin-top和bottom设置为我的打印页面以编写页眉和页脚。

我在Firefox中做过。但它在chrome和Internet Explorer中不起作用。

当我使用@page代码时，它适用于chrome。但我不能在顶部和页脚底部写标题。我该如何解决这个问题？

这是我的代码

pagination.php

<!DOCTYPE HTL> 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9">
<meta name="robots" content="noindex, nofollow">
<meta name="googlebot" content="noindex">
<meta http-equiv="cache-control" content="no-cache">    
<title>Brove.NET ISO Yazılımı</title>
<link rel="stylesheet" type="text/css" href="css/pagination.css" />
</head>

<body>
<table class="header" cellpadding="0" cellspacing="0">
  <tr>
    <td>header
    </td>
  </tr>
</table>

<table class="content" cellpadding="0" cellspacing="0">
  <tr>
    <td valign="top">
   content
    </td>
  </tr>
</table>

<table class="footer" cellpadding="0" cellspacing="0">
  <tr>
    <td>footer
    </td>
  </tr>
</table>

</body>
</html>

pagination.css

@media screen{
.header{
    width:768px;
    height:100px;
    border:2px solid #000;
}

.content{
    width:768px;
    margin-top:10px;
    margin-bottom:10px;
    height:1000px;
}

.footer{
    width:768px;
    height:100px;
    border:2px solid #000;
}
}

@media print{

.header{
    position:fixed;
    top:0;
    left:0;
    width:768px;
    height:100px;
    border:2px solid #000;
}

.content{
    width:768px;
    margin-top:120px;
    margin-bottom:120px;
    height:1000px;
}

.footer{
    position:fixed;
    left:0;
    bottom:0;
    width:768px;
    height:100px;
    border:2px solid #000;
}

@page{
    margin-bottom:150px;
}


}

IE截图：

enter image description here

Firefox截图：

enter image description here

Chrome屏幕截图：

enter image description here

打印页面边距在chrome和ie中不起作用

0 个答案: