6

@pageCSS3の機能をいじってみcounter(page)ましたが、印刷出力にページ番号が追加されていません。私が何をしても、これは単に機能していないようです。

私の足場は次のようになります。

<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="utf-8">
        <style type="text/css">
        @page {
           counter-increment: page;
           counter-reset: page 1;
           @top-right {
              content: "Page " counter(page) " of " counter(pages);
           }
        }
        </style>
<head>

<body>
        <div>

        Lorem ipsum dolor...
        /* this gets long, 2 pages of text */
        </div>
</body>
</html>

私がこれをテストしている方法は、ブラウザーでページを開き、PDF ファイルに印刷し、最後に内容を確認することです。ブラウザーが異なれば、出力は少し異なりますが、適切なページ番号がどこにも表示されません。

OS: リナックスミント

ブラウザー: Chromium 25.0.1364.160、Firefox 20.0.1、Opera (パッケージ マネージャーの最新版)

何か案は？

4

2 に答える 2

1

これに対するブラウザのサポートは標準に達していません。

@page {margin: 2in} は新しいバージョンの Firefox でサポートされていますが、@page の他のパラメーターはサポートされていません。これは他のブラウザにも当てはまると思います。

于 2013-04-16T02:25:02.317 に答える
0

ファイルは次のようになります。ページ カウンターは特別なものであり、設定やインクリメントの必要がないことに注意してください。

Firefox、webkit、および Opera も css3-pages をサポートしていないため、動作しません。MSDN が示唆しているにもかかわらず、新しいバージョンの IE もそうではありません。

<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="utf-8">
        <style type="text/css">
        @page {
          @top-right {
              content: "Page " counter(page) " of " counter(pages);
           }
        }
        </style>
<head>

<body>
        <div>

        Lorem ipsum dolor...
        /* this gets long, 2 pages of text */
        </div>
</body>
</html>
于 2013-07-11T14:31:19.003 に答える