Posted by : Unknown
Jumat, 05 Juli 2013
Bagaimana cara meletakkan gambar pada halaman HTML kita.....? Ya, kali ini saya akan memberikan tips bgaimana agar kita bisa meletakkan suatu gambar atau background pada halaman kita sehingga terlihat lebih menarik.
Pada dasarnya format gambar ada tiga yaitu : GIF,JPG,dan PNG
Kita bisa menggunakan GIF atau PNG untuk gambar yang transparan atau yang minim, misalkan logo , baner atau juga bisa untuk animasi. Dan untuk memperoleh kualitas yang bagus kita bisa menggunakan format JPG.
Gambar pada HTML
Untuk memasukkan gambar ke dalam dokumen HTML digunakan elemen img di ikuti dengan src (source) sebagai sumber atau lokasi dari gambar.
Untuk meletakkan gambar sesuai keinginan kita bisa menambahkannya dengan script style:float. Right untuk posisi kanan, left untuk posisi kiri dan middle untuk posisi tengah.
Kanan :
Pada dasarnya format gambar ada tiga yaitu : GIF,JPG,dan PNG
Kita bisa menggunakan GIF atau PNG untuk gambar yang transparan atau yang minim, misalkan logo , baner atau juga bisa untuk animasi. Dan untuk memperoleh kualitas yang bagus kita bisa menggunakan format JPG.
Gambar pada HTML
Untuk memasukkan gambar ke dalam dokumen HTML digunakan elemen img di ikuti dengan src (source) sebagai sumber atau lokasi dari gambar.
<img src="lokasi gambar" />
Pada saat kita meletakkan gambar, ada tiga atribut yang harus disertakan yaitu alt, width, dan height. Alt (alternate) merupkan suatu tek alternatif jikalau gambar tidak bisa ditampilkan. Sedangkan width dan height merupakan panjang gambar dan lebar gambar itu.<img src="lokasi gambar" alt="teks alternatif" width="lebar"
height="tinggi" />
Memposisikan GambarUntuk meletakkan gambar sesuai keinginan kita bisa menambahkannya dengan script style:float. Right untuk posisi kanan, left untuk posisi kiri dan middle untuk posisi tengah.
Kanan :
<img src="Lokasi gambar" style="float:right;" alt="Gagal dimuat"
width="100"height="100" />
Tengah :<div style="text-align:center;"><img src="Lokasi gambar"
alt="Gagal dimuat" width="100" height="100" /></div>
Kiri :
<img src="Lokasi gambar" style="float:left;" alt="Gagal dimuat"
width="100" height="100" />