Mengapa Saya Tidak Boleh Mencetak Nombor Halaman dalam HTML dan Apakah Penyelesaiannya?

Tidak Dapat Mencetak Nombor Halaman pada Halaman HTML?

Penerangan Masalah:

Walaupun meneliti secara meluas, nombor halaman gagal untuk muncul semasa mencetak dokumen HTML.

Kod CSS Digunakan:

@page {
  margin: 10%;
  @top-center {
    font-family: sans-serif;
    font-weight: bold;
    font-size: 2em;
    content: counter(page);
  }
}

Peraturan @page telah dicuba di dalam dan di luar @media semua blok tetapi tidak berhasil.

Penyelesaian:

Disebabkan pengehadan pelayar web, melaksanakan nombor halaman menggunakan @page tidak dapat dilaksanakan. Penyelesaian alternatif disediakan oleh Oliver Kohll, yang menggunakan pemformatan berasaskan jadual dalam CSS tanpa bergantung pada @halaman:

CSS:

#content {
    display: table;
}

#pageFooter {
    display: table-footer-group;
}

#pageFooter:after {
    counter-increment: page;
    content: counter(page);
}

HTML:

<div>
<p><strong>Penyesuaian:</strong></p>
<p>Kemunculan nombor halaman boleh disesuaikan dengan mengubah suai sifat #pageFooter, seperti pemformatan teks, kedudukan dan penggayaan latar belakang.</p>
</div>

Atas ialah kandungan terperinci Mengapa Saya Tidak Boleh Mencetak Nombor Halaman dalam HTML dan Apakah Penyelesaiannya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!