@ページを使用して各印刷ページでフッターを繰り返します

@pageを使用して各印刷ページでいくつかのフッター情報を繰り返すにはどうすればよいですか？@ページを使用して各印刷ページでフッターを繰り返します

「重複」の質問で示唆されている固定位置divを使用したくないです。

私は本体だけで、次のと完全に標準のHTMLテンプレート持っ

：

@media print { 

    .page-break { 
     page-break-after: always!important; 
    } 

} 

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

@page :left { 
    @bottom-left { 
    content: "This is a test"; 
    } 
}

Chromeの最新バージョンでの瞬間：これは私のcssである

<div id="main"> 

    <h1>This is the title</h1> 
    <p>And the content</p> 

</div>

を印刷プレビューには何も表示されません。どこが間違っていますか？

<head> 
    <style> 
     p { page-break-after: always; } 
     .footer{ position: fixed; bottom: 0px; } 
     .pagenum:before { content: counter(page); } 
    </style> 
    </head> 
    <body> 
    <div class="footer">Page: <span class="pagenum"></span></div> 
    <p>lorem ipsum ...</p> 
    <p>lorem ipsum ...</p> 
    </body>

私の例では、ページフッターのためですが、私は下の、そしてもちろんの「フッター」が「ヘッダー」になるとどこがトップを指定することで、ページのヘッダーと同じ操作を行うことができます。

出典

2016-09-01 Rob

の可能性のある重複した[5ページで文書のすべての印刷ページにヘッダーとフッターを印刷するにはHTMLを使用する方法？]（http://stackoverflow.com/questions/1360869/how-to-use- html-to-print-header-and-footer-on-every-print-of-a-document-w） – CBroe

@CBroe '@ page'を利用しようとしています。また、私が正しく使用している場合は、構文が賢明であるとは思えません。 – Rob

このリンクのページをさらに表示すると、250ほどの有益な投票があります。これは最も関連性の高い回答のようです。しかし、私はあなたに同意します。それは受け入れられる答えがないので、リンクするのは良い質問ではありません。 – Lee

-1

あなたはこのようにそれを試すことができます。ヘッダーとフッターの両方を置くことができます。

出典

2016-09-01 14:04:51

この例では、ページの内容はフッターに表示されますか？だから、フッターはいくつかのコンテンツの上に座ってしまうでしょうか？ – Rob

私はこれを使って遊んでいます。 @pageには非常に限られた使用しかないようです。ここに私が得ることができるものがあります。あなたが望んでいたものではありません。可能であれば、位置付けされたdivが最適かもしれません。

@media print { 
    .page-break { 
     page-break-after: always !important; 
    } 

    /* this adds the content to the bottom of the first page only. 
    div::after { 
     content: "This is a test"; 
     bottom: 0; 
     position: absolute; 
    } */ 

    /* this adds the content right beside the div. kind of useless. 
    .page-break::after { 
     content: "This is a test"; 
    } */ 

    /* this adds the content to the bottom of the first page only, 
     but multiple times; once for every page-break class i guess. 
    .page-break::after { 
     content: "This is a test"; 
     position: absolute; 
     bottom: 0; 
    } */ 
}

出典

2016-09-02 00:57:44 wazz

それは難しいです、私は知っています。改ページは常に使用されるとは限りません。時々、コンテンツは自然に次のページに流れていきます。他の時間に、ユーザーは、次のページにコンテンツが必要な場合は、Wordpress経由でページ区切りを入れることを選択します。 – Rob

@ページを使用して各印刷ページでフッターを繰り返します

答えて

関連する問題