某些页面的@Page空白标题

时间:2019-05-30 14:03:31

标签: html css

我一直在尝试格式化网页以使其友好。在第一页上,我想要一个空白标题。在其余页面上,我想在标题中输入文本。我从2005 Printing a Book看过这篇文章,并且很难理解这些示例。

我写了一些代码。除页面标题外,它均有效。

@page {
  size: 7in 9.25in;
  margin: 27mm 16mm 27mm 16mm;
}

div.titlepage,
div.chapter,
div.appendix {
  page-break-after: always;
}

div.titlepage {
  page: blank;
}

@page :left {
  @top-left {
    content: "Here is a story";
  }
}

@page blank :left {
  @top-left {
    content: normal;
  }
}
<div class="titlepage">
  <h1>Title Page</h1>
</div>
<div class="chapter">
  <h1 style="color:red">Chapter 1</h1>
  <p>
    Text goes here
  </p>
</div>
<div class="chapter">
  <h1 style="color:blue">Chapter 2</h1>
  <p>
    More text goes here
  </p>
</div>

0 个答案:

没有答案