Sebelum Anda memasukkan gambar ke sebuah website, Anda harus mempertimbangkan apakah penempatan gambar tersebut sudah cocok atau malah merusak tampilan dan konten website (tidak sesuai dengan isi website dan menyulitkan pembaca untuk membaca informasi di dalamnya). Pada materi kali ini, saya tidak hanya menjelaskan mengenai cara menambahkan gambar di HTML melainkan juga menjelaskan bagaimana cara mengatur posisi gambar atau mempercantik gambar dengan bingkai atau garis tepi.
Penggunaan tag <img>
Untuk menambahkan gambar ke HTML, Anda dapat menggunakan tag <img>. Berikut atribut – atribut yang terdapat pada tag <img> :| Atribut | Fungsi |
| src | Menunjukkan URL atau direktori lokasi file gambar berada |
| width | Lebar gambar (default : pixel) |
| height | Tinggi gambar (default : pixel) |
| align | Menentukan posisi teks di sekitar gambar |
| alt | Sebagai kata kunci gambar di search engine semisal Google dan menampilkan teks pengganti gambar jika gambar tidak dapat ditampilkan misalnya karena koneksi lambat |
| title | Memberikan keterangan gambar ketika cursor diarahkan ke gambar tersebut |
| border | Memberikan bingkai (garis tepi) pada gambar dengan nilai menggunakan satua pixel (default) |
<html>
<head>
<title>Cara Menambahkan Gambar di Html</title>
</head>
<body>
<p>Dibawah ini merupakan gambar pantai:</p>
<img src="pantai.jpg" alt="gambar pantai">
</body>
</html>
AGAR GAMBAR TAMPIL,FILE HTML HARUS DISIMPAN BERSAMAAN DENGAN GAMBAR KITA.
Ketika kode HTML dijalankan, tampilannya di browser akan seperti ini:
0 comments:
Post a Comment