sharingilmu.web.id

Belajar tak akan lengkap jika kita tidak berbagi

Menampilkan Gambar Pada HTML

Posted by admin on 04 Aug 2012

Gambar merupakan sesuatu yang dapat membuat tampilan web kita menjadi lebih hidup dan lebih menarik untuk dilihat, jadi penggunaan gambar merupakan hal yang penting juga. Untuk menampilkan gambar pada HTML kita dapat menggunakan tag <img></img>. Tag ini memiliki beberapa atribut, yaitu src yang digunakan untuk mendeskripsikan tempat di mana file gambar disimpan, align untuk perataan gambar, width untuk mengatur lebar gambar dalam persen mau pun pixel, height untuk mengatur tinggi gambar dalam persen mau pun pixel,  alt untuk memberikan keterangan pada gambar jika source gambarnya tidak ada, dan yang terakhir adalah tiltle untuk memberikan keterangan pada gambar saat gambar didekati kursor. Untuk lebih jelasnya silakan coba source code di bawah ini :

<html>
<head>
<title>Gambar</title>
</head>
<body>
<img src="cek.jpg" alt="ini adalah gambar" title="Gambar"
align="right" width="150px" height="150px">
</body>
</html>

Pada src=”cek.jpg” silakan diganti dengan letak source gambar yang diinclude kan. Gambar yang diinclude kan berada pada satu folder dengan file html ini. Jika file berada di di dalam foder lagi, misal file gambar.html ini disimpan pada folder belajar, kemudian di dalam folder belajar masih ada folder lagi yaitu folder gambarku yang berisi file-file gambar yang akan diinclude kan pada file html, maka source codenya menjadi src=”gambarku/cek.jpg”.

Oya, untuk mencoba atribut alt, silakan coba dengan menghilangkan source gambar yang akan ditampilkan atau mengganti kata gambar.jpg (misal) pada src=”gambar.jpg” dengan kata lain di mana kata lain tersebut bukan nama dari gambar yang akan diinclude kan. Agar lebih paham silakan dicoba sendiri ya, karena belajar tanpa mencoba itu belum belajar namanya.


Categories: HTML, Tutorial



× 6 = 6