Pages

MENGENAL ATRIBUT TAG <IMG>

Cara Memasukan Gambar pada HTML

  1. src
  2. Atribut tag src berfungsi untuk mununjukan dimana gambar tersebut berada. jika filenya berada dalam satu folder dengan file htmlnya maka cukup ditulis nama filenya dan ekstensinya saja, tapi jika keluar dari folder file htmlnya maka harus dituliskan "../" tapi jika masuk ke folder yang berada dalam satu folder file htmlnya maka dituliskan dengan "/" berikut ini contohnya :
    <img src="a.jpg"> jika gambar dan file html berada dalam satu folder.
    <img src="../a.jpg"> jika gambar berada di luar satu folder dari file htmlnya.
    <img src="/gambar/a.jpg"> jika gambar berada di dalam folder gambar yang berada dalam satu folder gambarnya.
  3. width
  4. seperti yang telah kita kenal bahwa atribut width itu untuk mengatur lebar. Seperti halnya pada Atribut ini juga untuk mengatur lebar image yang akan ditapilkan. Contoh :
    <img src="a.jpg" width"100px">
  5. height
  6. seperti halnya height kita juga telah mengenal atribut ini. atribut ini berfungsi untuk mengatur tinggi gambar yang akan ditampilkan. Contoh :
     <img src="a.jpg" width"60px" height="200px">
  7. alt
  8. Atribut ini digunakan untuk memberikan keterangan tambahan dari gambar. ALT merupakan kepanjangan dari ALTERNATIVE. Penggunaan atribut ini pada setiap gambar akan menghasilkan halaman yang efektif dan akan sangat mudah untuk dibaca oleh mesin pencari. Contoh :   
    <img src="a.jpg" width"60px" height="200px" alt="keterangan gambar">
  9. align
  10. Atribut ini digunakan untuk mengatur posisi image berada di kiri, tengah, atau kanan. Contoh :
    <img src="a.jpg" width"60px" height="200px" alt="keterangan gambar" align="right">
  11. border
Atribut ini digunakan untuk memberi border pada gambar yang akan ditampilkan. Contoh :

<img src="https://pbs.twimg.com/profile_images/425274582581264384/X3QXBN8C.jpeg" width"60px" height="200px" alt="keterangan gambar" align="right" border="5px">
maka skrip diatas akan tampil seperti berikut :

keterangan gambar