HTML sintaks Gambar.

HTML Gambar – Tag <img> dan Atribut src.

Dalam HTML, gambar didefinisikan dengan tag <img>.

Tag <img> kosong, yang berarti bahwa itu hanya berisi atribut, dan tidak memiliki tag penutup.
Untuk menampilkan sebuah gambar pada halaman, Anda perlu menggunakan atribut src.  Src singkatan dari “sumber”. Nilai dari atribut src adalah URL dari gambar yang ingin ditampilkan.

Sintaks untuk mendefinisikan gambar:

<img src=”url” alt=”some_text”/>

URL menunjuk ke lokasi di mana gambar disimpan. Sebuah gambar bernama “boat.gif”, yang terletak di direktori “images” pada “www.w3schools.com” memiliki URL: http://www.w3schools.com/images/boat.gif.

Browser menampilkan gambar di mana tag <img> terjadi dalam dokumen. Jika Anda menempatkan tag gambar antara dua paragraf, browser menunjukkan paragraf pertama, kemudian gambar, dan kemudian paragraf kedua.

 

HTML Gambar – Atribut Alt.

Atribut alt diperlukan menentukan sebuah teks alternatif untuk gambar, jika gambar tidak dapat ditampilkan.

Nilai atribut alt adalah seorang penulis-didefinisikan teks:
<img src=”boat.gif” alt=”Big Boat” />

Atribut alt menyediakan informasi alternatif bagi gambar jika pengguna untuk beberapa alasan tidak bisa melihatnya (karena koneksi yang lambat, kesalahan dalam atribut src, atau jika pengguna menggunakan pembaca layar).

 

HTML Gambar – Mengatur Tinggi dan Lebar dari suatu Gambar.

Tinggi dan atribut lebar digunakan untuk menentukan tinggi dan lebar dari suatu gambar.

Nilai atribut yang ditetapkan dalam piksel secara default:
<img src=”pulpit.jpg” alt=”Pulpit rock” width=”304″ height=”228″ />

Tip:  Ini adalah praktik yang baik untuk menentukan baik tinggi dan atribut lebar untuk gambar. Jika atribut ini ditetapkan, ruang yang diperlukan untuk gambar dicadangkan saat halaman dimuat. Namun, tanpa atribut-atribut ini, browser tidak mengetahui ukuran gambar. Efeknya akan bahwa tata letak halaman akan berubah selama pemuatan (sedangkan beban gambar).

Leave a Reply

Your email address will not be published. Required fields are marked *