Cara Menyembunyikan Gambar Digital di Halaman Web

Lembar gaya Cascading dapat membantu Anda menghemat waktu saat memelihara halaman di situs web Anda. Gambar digital, misalnya, mungkin muncul di beberapa halaman Web Anda. Jika Anda perlu mencegah orang melihat gambar-gambar itu, Anda dapat menggunakan CSS untuk menyembunyikan gambar dengan mengubah satu kata di dokumen HTML Anda. Anda bahkan dapat membuat gambar muncul kembali secara instan dengan membuat pembaruan cepat ke kode CSS dokumen Anda.

1.

Buka dokumen HTML yang berisi setidaknya satu gambar dan temukan bagian tubuh dokumen. Tag gambar bagian tubuh akan tampak serupa dengan yang ditunjukkan di bawah ini:

Tag gambar dasar yang dimulai dengan kata "img." Tag dalam contoh ini referensi gambar bernama "img / setting-up-new-business / 167 / how-hide-digital-images-web-pages-2.jpg."

2.

Ubah salah satu tag gambar Anda sehingga referensi kelas CSS bernama "visibilitas, " seperti yang ditunjukkan dalam contoh berikut:

Jika tag sudah memiliki referensi kelas, Anda harus mengubah tag dengan cara yang sedikit berbeda. Asumsikan bahwa tag Anda muncul seperti yang ditunjukkan di bawah ini:

Tag gambar itu sudah mereferensikan kelas bernama "myclass." Jika tag img Anda sudah merujuk kelas, seperti yang ini, tambahkan "visibilitas" setelah nama kelas, seperti yang terlihat di bawah:

3.

Rekatkan yang berikut ini ke bagian kepala dokumen Anda:

Ini menciptakan kelas visibilitas dan menetapkan nilai atribut tampilan ke "blok." Nilai itu membuat gambar terlihat.

4.

Simpan dokumen dan buka di browser apa pun. Gambar Anda akan tampak seperti biasa.

5.

Kembali ke editor Anda dan cari kode CSS yang Anda tambahkan ke bagian kepala dokumen. Ubah nilai atribut tampilan dari "blok" menjadi "tidak ada" dan simpan dokumen.

6.

Kembali ke browser Anda dan tekan "Ctrl-F5" untuk menghapus penyimpanan sementara. Saat halaman diperbarui, gambar Anda akan hilang.

Kiat

  • Tambahkan referensi kelas ke setiap gambar yang ingin Anda sembunyikan. Beri nama kelas CSS Anda apa pun yang Anda suka. Namanya "visibilitas" dalam contoh ini.
  • Jadikan gambar Anda terlihat lagi dengan mengubah kata "tidak ada" menjadi "blokir."

Pesan Populer