HTML Images

Sebagian besar dari web adalah Gambar. HTML membuatnya sangat mudah bagi kamu untuk menanamkan gambar ke dalam halaman web kamu.

Untuk menanamkan sebuah gambar pada sebuah halaman web, gambar umum atau pertama lebih baik berformat Jpg, gif, atau Png.. kamu dapat membuat gambar dalam editor gambar (seperti Adobe Photoshop) dan menyimpannya dalam format yang benar.

Setelah kamu membuat gambar, kamu perlu menanamkan ke dalam halaman web kamu. Untuk menanamkan gambar ke dalam halaman web kamu, gunakan tag <img />, menentukan lokasi sebenarnya dari gambar.

Contoh Penggunaan Gambar

<img alt="i love HaTe ML" height="81" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ_YD__CGH7x7dnIk3XmlrlUXlkjBkoCPkUUv9ciecuJ6JiR4G1D_4n8Q-4QNnqGY9oKKob8BbNhN0lArabYds28ODbaAMsg1Y_ewfQfhKa54JKRPZ3VOK5uKzCnF4_FKzstlbkGeOK3M/s1600/IloveHTML.png" width="319" />
atau
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ_YD__CGH7x7dnIk3XmlrlUXlkjBkoCPkUUv9ciecuJ6JiR4G1D_4n8Q-4QNnqGY9oKKob8BbNhN0lArabYds28ODbaAMsg1Y_ewfQfhKa54JKRPZ3VOK5uKzCnF4_FKzstlbkGeOK3M/s1600/IloveHTML.png" width="319" height="81" alt="i love HaTe ML" />

 Dari kode diatas maka diperolaeh hasil seperti ini :

src	Diperlukan atribut. Ini adalah path ke gambar.
width	Opsional atribut (tapi direkomendasikan). Ini menentukan lebar untuk menampilkan gambar. Jika gambar yang sebenarnya lebih luas, itu akan menyusut ke dimensi yang kamu tentukan di sini. Demikian juga, jika gambar yang sebenarnya lebih kecil akan diperluas untuk dimensi kamu. Saya tidak menganjurkan kamu untuk menggunakan ukuran yang berbeda untuk gambar, karena akan kehilangan kualitas. Lebih baik untuk menggunakan ukuran yang asli..
height	Opsional atribut (tapi direkomendasikan). Ini menentukan tinggi untuk menampilkan gambar. Atribut ini berfungsi mirip dengan lebar.
alt	Teks alternatif , teks yang akan muncul jika gambar gagal dimuat

Image Alignment

Digunakan untuk menentukan posisi dari gambar (kanan , kiri atau tengah)
Contoh :

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ_YD__CGH7x7dnIk3XmlrlUXlkjBkoCPkUUv9ciecuJ6JiR4G1D_4n8Q-4QNnqGY9oKKob8BbNhN0lArabYds28ODbaAMsg1Y_ewfQfhKa54JKRPZ3VOK5uKzCnF4_FKzstlbkGeOK3M/s1600/IloveHTML.png"width="319" height="81" alt="i love HaTe ML" align="right"/>
Blog ini memang bagus , walau apa adanya , tapi berguna untuk menambah ilmu pengetahuan seputar HTML .

Dari kode diatas maka diperolaeh hasil seperti ini :

Blog ini memang bagus , walau apa adanya , tapi berguna untuk menambah ilmu pengetahuan seputar HTML .