Bagaimana Saya Boleh Menyembunyikan Elemen Halaman Web Semasa Mencetak?

Menyembunyikan Elemen semasa Pencetakan Halaman Web

Apabila mencetak halaman web, selalunya wajar untuk mengecualikan elemen tertentu daripada cetakan. Contohnya, butang atau pautan yang boleh dilihat pada skrin mungkin muncul pada versi bercetak, mewujudkan kekacauan yang tidak diingini.

Penyelesaian: Pertanyaan Media CSS

Pertanyaan media CSS menawarkan penyelesaian kepada masalah ini. Dengan menggunakan peraturan penggayaan khusus dalam pertanyaan media untuk medium 'cetak', anda boleh mengawal keterlihatan elemen berdasarkan sama ada cetakan sedang dijalankan atau tidak.

Pelaksanaan:

1. Buat Lembaran Gaya Khusus Cetakan Peraturan:

   Tambahkan kod berikut pada lembaran gaya anda:

   @media print {
       .no-print, .no-print * {
           display: none !important;
       }
   }

   Peraturan ini menyatakan bahawa mana-mana elemen dengan kelas 'tiada-cetak' akan disembunyikan apabila penyemak imbas berada dalam mod cetakan.

2. Gunakan tanpa cetakan Kelas:

   Dalam HTML anda, tambahkan kelas 'tiada-cetak' pada elemen yang ingin anda sembunyikan semasa mencetak. Contohnya:

   <a class="no-print" href="#">Print (click Here To Print)</a>

Contoh:

Contoh berikut menunjukkan kesan kelas 'tanpa cetak' pada pencetakan:

"Good Evening"
<a class="no-print" href="#">Print (click Here To Print)</a>

Apabila pengguna mengklik pautan "Cetak", penyemak imbas akan memaparkan cetakan yang hanya mengandungi teks "Selamat Petang." Pautan "Cetak" itu sendiri akan disembunyikan.

Atas ialah kandungan terperinci Bagaimana Saya Boleh Menyembunyikan Elemen Halaman Web Semasa Mencetak?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!