是否可以将元素放在@page边距之外?

时间:2016-08-02 03:21:29

标签: css

如果我设置了@print样式表,边距为60毫米,是否可以在页面顶部20毫米处显示带有position: fixed;的徽标?到目前为止,似乎@page边距之外的所有内容都会被裁剪。

在下面的代码段中实际看到问题很困难,但请在此处查看:https://jsbin.com/xaxanamihu/edit?html,css,output

此处的纯输出:https://output.jsbin.com/xaxanamihu

查看该页面的打印预览。您会看到.logo div被裁剪,因为它的位置在技术上超出了由@page边距设置的视图区域。

我基本上需要模仿我的打印样式中的页眉和页脚的概念,例如Apple页面或Word文档。标题中的相同徽标和每页上页脚中的小文本,内容区域为页眉和页脚提供了足够的余量。



.logo {
  background: rgb(200, 200, 200);
  color: white;
  height: 100px;
  left: 0;
  position: absolute;
  top: 0;
  width: 100px;
}

@page {
	size: auto;
	margin: 60mm;
}

@media print {
  .logo {
    background: black;
    left: -50px;
    top: -50px;
  }
}

<div class="logo">Logo.</div>
&#13;
&#13;
&#13;

0 个答案:

没有答案