Mengenal fungsi @media print pada css

@media print berguna untuk mengatur format khusus pada saat mencetak halaman web saja. Sebuah halaman web memiliki banyak konten dengan berbagai pernak-perniknya. Namun ada kalanya pengunjung ingin mencetak halaman website kita hanya isi utama saja. Misal dalam sebuah halaman web terdapat isi berita dan komentar berita. Bagaimana caranya jika saat pengunjung ingin mencetak halaman berita tersebut, komentar beritanya akan otomatis hilang? Dengan menggunakan fungsiĀ @media print pada css untuk mencetak halaman seperti itu sangat mudah. Contoh kita punya halaman HTML seperti berikut:

<div id="content">
Contoh isi berita...
</div>

<div id="comment">
Komentar berita...
</div>

Maka jika kita ingin isi berita saja yang tampil saat mencetak maka tambahkan script dibawah ini pada css anda:

@media print {  
    #comment{display:none;}
}

Mudah kan? silahkan mencoba semoga bermanfaat

 

[AdsWithin]

(Visited 2,782 times, 1 visits today)

Related Posts

One thought on “Mengenal fungsi @media print pada css

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Situs ini menggunakan Akismet untuk mengurangi spam. Pelajari bagaimana data komentar Anda diproses.

WhatsApp chat