Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Menambah Nombor Halaman pada Dokumen Boleh Cetak Menggunakan CSS dan HTML?

Bagaimanakah Saya Boleh Menambah Nombor Halaman pada Dokumen Boleh Cetak Menggunakan CSS dan HTML?

Patricia Arquette
Lepaskan: 2024-11-26 13:42:09
asal
618 orang telah melayarinya

How Can I Add Page Numbers to Printable Documents Using CSS and HTML?

Mencapai Penomboran Halaman dengan CSS dan HTML untuk Dokumen Boleh Cetak

Mencetak halaman web selalunya memerlukan elemen tambahan seperti pengepala, pengaki dan penomboran untuk persembahan profesional. Jika anda menghadapi keperluan untuk memasukkan nombor halaman dalam pengaki, berikut ialah penyelesaian menggunakan CSS dan HTML.

Menggunakan Harta Halaman CSS:

Peraturan CSS @page menyediakan kawalan yang meluas ke atas elemen bercetak pada halaman. Untuk menambah nombor halaman pada pengaki, anda boleh menentukan kandungan yang akan dipaparkan menggunakan margin "@bawah-kanan":

@page {
  @bottom-right {
    content: counter(page) " of " counter(pages);
  }
}
Salin selepas log masuk

Dalam coretan ini:

  • counter( halaman) mewakili nombor halaman semasa.
  • kaunter(halaman) mewakili jumlah bilangan halaman.

Dengan menggabungkan pembilang ini, kandungan pengaki akan memaparkan nombor halaman semasa dan jumlah bilangan halaman.

Keserasian dan Pertimbangan Penyemak Imbas:

Harta @page disokong oleh semua penyemak imbas moden utama. Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa versi lama mungkin tidak melaksanakan ciri ini sepenuhnya. Pautan yang disediakan dalam jawapan menawarkan sumber tambahan dan cerapan ke dalam halaman CSS penomboran:

  • http://www.w3.org/TR/css3-page/
  • http://www.intelligrape.com/blog/2010/08/20 / add-page-number-using-page-property-of-css/
  • http://www.princexml.com/doc/6.0/page-numbers/

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menambah Nombor Halaman pada Dokumen Boleh Cetak Menggunakan CSS dan HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan