11

大きなhtmlファイルを印刷するときに、すべてのページに背景画像を一度印刷する必要があります。これで、最初のページにのみ印刷されます。したがって、そのための css の部分は次のとおりです。

@media all {
    body
    {
        text-align:left;
        background-image:url('/C:/logo.png');
        background-repeat:no-repeat;
        background-position:right top;
    }
}
4

3 に答える 3

1

div背景として機能するwithを作成することで、クロムでも背景を印刷する方法を見つけましたposition: fixed。うまくいかないときのアイデアはありましたが、考えbackground-attachment: fixedさせposition: fixedられました。div
この方法では、クロムでもすべてのページに背景が完全に印刷されます。

https://stackblitz.com/edit/web-platform-vlfqfz?file=index.html

HTML:

<body id="print-layout">
    <div class="bg-container"></div>
    <div class="content">
      <h1>Hello there!</h1>
      Long content...
    </div>
</body>

CSS

body {
  width: 100%;
  height: 100%;
  margin: 0;
}


.bg-container {
  position: fixed;
  height: 100%;
  width: 100%;
  z-index: 0;
  background-image: url(https://imgur.com/cjmB60j.jpg);
  background-size: 100% 100%;
}

.content {
  position: relative;
  z-index: 1;
  padding: 140px 55px;
}
于 2021-11-23T10:16:08.403 に答える
-4

すべてのページに CSS ファイルを含めるようにしてください。

<link type="text/css" rel="stylesheet" href="style.css">
于 2013-11-07T14:07:49.373 に答える