Gambar di dalam HTML

CARA MEMBUAT image  DI HTML

HTML image atau gambar 

1.Tag <img> digunakan untuk menampilkan gambar pada dokumen HTML.

2.Tag <img> termasuk salah satu dari empty element, maksudnya memiliki attribut tetapi tidak memiliki tag penutup.

3.Browser menampilkan gambar anda berdasarkan letak tag <img> di dokumen HTML anda.

Syntax dari HTML image


<img src='url'/>

Penjelasan :

1.<img> adalah tag pembuka.2.src adalah attribut yang digunakan sebagai informasi darimana url letak gambar yang akan ditampilkan tersimpan.


CONTOH IMAGE DI HTML :

Attribut alt  pada HTML image

Attribut alt digunakan untuk menggantikan gambar dengan pesan teks bila gambar tidak bisa ditampilkan.

<img src="https://41.media.tumblr.com/tumblr_mblajj2IFP1riarf0o1_500.png" />

Menentukan tinggi dan panjang gambar

Untuk menentukan lebar dan panjang sebuah gambar maka perlu ditambahkan attribut width dan height pada tag img

<img src="http://codingku.com/html/sample/street-fighter.jpg" width="400" height="300" />


catatan :
Sebuah kebiasan yang baik bila kita menentukan dari awal besar image dengan menuliskan attribut width dan height-nya sebab dengan begitu space/ruang kosong untuk image sudah diketahui dulu oleh browser. Bila browser tidak mengetahui ukuran dari image maka ketika sebuah halaman dibuka akan kita lihat sebuah layout yang berubah-ubah menunggu load dari image selesai.Sebaiknya penggunaan gambar diminimalkan sebab file gambar/image biasanya merupakan file yang berukuran besar sehingga akan membuat lambat akses terhadap website anda. 

Comments

Popular Posts