Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Menyembunyikan Elemen Seperti Butang Cetak Apabila Mencetak Halaman Web?

Bagaimanakah Saya Boleh Menyembunyikan Elemen Seperti Butang Cetak Apabila Mencetak Halaman Web?

Susan Sarandon
Susan Sarandonasal
2024-12-27 10:10:14413semak imbas

How Can I Hide Elements Like Print Buttons When Printing a Web Page?

Menyembunyikan Elemen Semasa Pencetakan Halaman Web

Mencetak halaman web ialah tugas biasa, tetapi ia boleh mengecewakan apabila elemen yang tidak diingini muncul dalam cetakan itu. Satu elemen sedemikian yang sering menimbulkan gangguan ialah butang cetak itu sendiri. Jika anda ingin mengalih keluar butang cetak daripada halaman bercetak anda, berikut ialah cara anda boleh mencapainya:

Pertanyaan Media CSS

Pertanyaan media dalam Helaian Gaya Cascading ( CSS) membolehkan anda menentukan gaya khusus untuk cetakan. Untuk menyembunyikan elemen semasa mencetak, anda boleh menggunakan peraturan cetakan @media:

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

Memohon Kelas

Setelah anda mempunyai peraturan CSS, anda perlu untuk menambah kelas pada elemen yang anda ingin sembunyikan. Anda boleh sama ada menetapkan kelas tanpa cetak secara langsung:

<button class="no-print">Print</button>

Atau tambahkannya pada kelas sedia ada:

<button class="btn btn-primary no-print">Print</button>

Contoh

Pertimbangkan contoh berikut:

<p>Good Evening</p>
<button>
@media print {
    #print-button {
        display: none !important;
    }
}

Apabila halaman dicetak, Butang "Cetak" akan disembunyikan, hanya meninggalkan teks "Selamat Petang" pada cetakan.

Nota:

Pengisytiharan !penting memastikan paparan: tiada gaya digunakan walaupun gaya lain cuba mengatasinya.

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

Kenyataan:
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