Cara Mengatasi Gambar Tidak Muncul di HTML dan CSS

19/09/2018    Risman Hakim    7494     Website

Cara Mengatasi Gambar Tidak Muncul di HTML dan CSS - Terkadang ketika sedang membuat website ada saja hal - hal yang tidak diinginkan terjadi, misalnya saja terjadi error, elemen tidak berfungsi dengan sesuai, ataupun hal sederhana berupa konten tidak muncul pada halaman website. Hal ini merupakan sesuatu yang wajar dan hampir semua developer pernah mengalamai hal seperti itu, tetapi semua itu pasti ada solusi dan cara mengatasinya. Contoh sederhana kasus yang mungkin biasa terjadi adalah ketika kita menambahkan gambar pada halaman web terkadang masih ada yang tidak muncul baik pada HTML atapun pada CSS. Nah, untuk itu saya akan coba membahasa bagaimana Cara Mengatasi Gambar Tidak Muncul di HTML dan CSS.

Ada beberapa hal yang harus diperhatikan ketika kita ingin menambahkan gambar supaya gambar muncul pada halaman web, mulai dari penulisan sintak dasar sampai pada letak file gambar itu yang kurang tepat dituliskan pada saat memanggil gambar. Berikut adalah hal - hal yang yang harus diperhatikan pada saat memanggil gambar pada HTML.

1. Penulisan dasar HTML dan CSS

Biasanya hal sederhana ketika gambar tidak muncul adalah pada penulisan dasar sintak atau tag HTML kurang tepat. Secara default penulisan dasar ketika ingin menambahkan gambar pada HTML adalah seperti berikut.

<body>
    <h1>DUMET School</h1>
    <p>Kursus Website, Digital Marketing & Desain Grafis</p>
    <img src="images/Logo-dumet.jpg" width="400">
</body>

Begitu juga penulisan pada sintak CSS harus diperhatikan, bisa jadi gambar tidak tampil karena cara penulisan kurang tepat, secara default ketika ingin menampilkan gambar penulisan dasar pada CSS seperti berikut.

body {
    background: url(images/bg.png);
}

Jika dirasa penulisan sudah benar tetapi masih belum tampil gambarnya, maka hal lain yang harus diperhatikan adalah.

2. Nama dan ekstensi gambar

Pastikan nama gambar dan ekstensi sudah benar dipanggil pada tag HTML dan CSS, karena ketika penulisan sintak sudah benar akan tetapi nama gambar dan ekstensi salah maka gambar tetap tidak akan muncul. Untuk itu kalian wajib memastikan nama dan ekstensi gambarnya.

Cara Mengatasi Gambar Tidak Muncul di HTML dan CSS

3. Lokasi gambar

Hal lainnya ketika gambar tidak tampil pada halaman web adalah memastikan lokasi gambar sudah tepat, terkadang kita suka lupa dengan nama folder dan lokasi gambar yang tidak disertakan ketika memanggil gambar. Jadi, pastikan lokasi dan folder gambar disertakan agar gambar bisa terbaca.

Cara Mengatasi Gambar Tidak Muncul di HTML dan CSS

Setelah memastikan semua hal diatas telah sesuai, maka harusnya gambar sudah bisa muncul pada halaman web. Nah, itulah beberapa Cara Mengatasi Gambar Tidak Muncul di HTML dan CSS, cukup sekian pembahasan kali ini semoga bisa membantu :)

Web Design, HTML CSS, Tips dan Trik, website

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More