0

我正在研究打印 CSS。我想做的是隐藏放置在每个页面上的页面标题/编号,并为每个页面添加一些顶部填充。为了摆脱我正在使用的页面标题/编号margin:0;,效果很好,但padding-top:30px;似乎无法正常工作。

@page { 
    size:8.5in 11in;  
    margin:0;
    padding-top:30px;
    orphans:5; 
    widows:5;
}

.page-break {
    page-break-after:always;
    margin:0!important;
    padding:0!important;
    font-size:0!important;
}
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec finibus interdum odio. Duis vel volutpat quam, sed feugiat diam. Fusce vulputate tellus ut leo iaculis ultrices. Sed ultrices odio ut lobortis bibendum. Vestibulum sed sodales leo. Mauris ullamcorper aliquam lorem, efficitur sagittis ex auctor a. In mattis mauris vitae diam rhoncus auctor.</p>

<p class="page-break"></p>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec finibus interdum odio. Duis vel volutpat quam, sed feugiat diam. Fusce vulputate tellus ut leo iaculis ultrices. Sed ultrices odio ut lobortis bibendum. Vestibulum sed sodales leo. Mauris ullamcorper aliquam lorem, efficitur sagittis ex auctor a. In mattis mauris vitae diam rhoncus auctor.</p>

<p class="page-break"></p>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec finibus interdum odio. Duis vel volutpat quam, sed feugiat diam. Fusce vulputate tellus ut leo iaculis ultrices. Sed ultrices odio ut lobortis bibendum. Vestibulum sed sodales leo. Mauris ullamcorper aliquam lorem, efficitur sagittis ex auctor a. In mattis mauris vitae diam rhoncus auctor.</p>

<p class="page-break"></p>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec finibus interdum odio. Duis vel volutpat quam, sed feugiat diam. Fusce vulputate tellus ut leo iaculis ultrices. Sed ultrices odio ut lobortis bibendum. Vestibulum sed sodales leo. Mauris ullamcorper aliquam lorem, efficitur sagittis ex auctor a. In mattis mauris vitae diam rhoncus auctor.</p>

<p class="page-break"></p>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec finibus interdum odio. Duis vel volutpat quam, sed feugiat diam. Fusce vulputate tellus ut leo iaculis ultrices. Sed ultrices odio ut lobortis bibendum. Vestibulum sed sodales leo. Mauris ullamcorper aliquam lorem, efficitur sagittis ex auctor a. In mattis mauris vitae diam rhoncus auctor.</p>

4

1 回答 1

1

为什么不使用.page-break来执行此操作?

.page-break {
  page-break-after: always;
  margin: 0 0 30px;
  padding: 0;
  font-size: 0;
}

(为了清楚起见,我删除了!importants。你真的需要它们吗?)

于 2018-02-12T17:14:31.717 回答