Bagaimanakah Saya Boleh Mengatasi Tetapan Cetakan Pelayar Lalai Menggunakan CSS dan JavaScript?

Melumpuhkan Tetapan Cetakan Penyemak Imbas Lalai untuk Cetakan daripada Halaman Web

Ramai pembangun web telah mencari penyelesaian untuk mengubah suai tetapan cetakan penyemak imbas lalai, khusus untuk pengepala, pengaki dan jidar. Artikel ini bertujuan untuk memberikan pemahaman menyeluruh tentang pilihan yang tersedia melalui CSS dan JavaScript, merentas penyemak imbas yang berbeza.

Penyelesaian CSS

Arahan @page dalam CSS menawarkan pemformatan lanjutan pilihan untuk media berhalaman seperti kertas. Ia membolehkan anda menentukan margin pencetak khusus untuk halaman, bebas daripada margin unsur.

@page {
    margin: 0mm;
}

Walau bagaimanapun, sokongan untuk arahan ini berbeza-beza antara penyemak imbas. Walaupun penyemak imbas seperti Safari, Internet Explorer, Opera dan Chrome menyokong penetapan margin halaman pencetak, Firefox masih tidak menyokongnya.

Menyesuaikan Pecah Halaman dan Margin Kandungan

Selain daripada jidar cetakan, anda boleh mengawal pemisah halaman dan jidar kandungan menggunakan CSS untuk mengalih keluar pengepala dan pengaki.

body {
    margin: 10mm 15mm 10mm 15mm;
}

Apabila mencetak, penyemak imbas akan menyekat kandungan dalam kawasan yang ditentukan oleh jidar badan, dengan berkesan menyembunyikan pengepala dan pengaki halaman. Walau bagaimanapun, ambil perhatian bahawa ini hanya berfungsi jika kandungan bercetak muat pada satu halaman.

Gelagat Penyemak Imbas

Gelagat tetapan ini berbeza merentas penyemak imbas.

• Internet Explorer: Menetapkan margin cetakan yang betul tetapi menunjukkan pengepala/pengaki penyemak imbas dengan latar belakang legap, menyembunyikan kandungan.
• Firefox: Meletakkan kandungan dengan betul tetapi memaparkan teks pengepala/pengaki penyemak imbas dan teks kandungan, menghasilkan paparan bercampur.
• Opera: Menyembunyikan pengepala tetapi jidar tidak ditetapkan dengan betul, membawa kepada isu keterlihatan pengepala yang berpotensi.
• Chrome: Menyembunyikan pengepala/pengaki penyemak imbas jika jidar halaman bercanggah dengannya kedudukan, menawarkan pelaksanaan terbaik untuk menyembunyikan elemen ini.

Kesimpulan

Walaupun CSS menyediakan mekanisme untuk menangani tetapan cetakan, sokongan dan tingkah laku penyemak imbas berbeza-beza. Chrome mempamerkan tingkah laku yang paling diingini untuk menyembunyikan pengepala dan pengaki. Walau bagaimanapun, jika konsistensi merentas penyemak imbas adalah penting, penyelesaian alternatif mungkin perlu dipertimbangkan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengatasi Tetapan Cetakan Pelayar Lalai Menggunakan CSS dan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!