Belajar HTML Part 3: Menambahkan Gambar #17

Dekatsaja    8/31/2024    Coding   

 

Kalau kemarin gue sempat bahas:

1. Belajar HTML Basic Part 1 #14
2. Belajar HTML part 2: Membuat Link #16

Kali ini gue akan nerusin part 3 yaitu cara menambahkan gambar, gaperlu basa-basi lagi. Langsung aja yak.

Dengan HTML kita juga dapat menambahkan gambar, Untuk menambahkan gambar kita bisa menggunakan tag <img> . Sama halnya dengan <br> , <img> juga merupakan tag kosong yang ga perlu tag penutup. Untuk memasukkan gambar kita memerlukan atribut src, penemoatannya mirip dengan atribut href nya anchor <a>.

Contoh:

<img src="https://storage.googleapis.com/takeapp/media/cm07mfpdv00020cl3ee8x7z1p.jpg">

Hasilnya:

 "https://storage.googleapis.com/takeapp/media/cm07mfpdv00020cl3ee8x7z1p.jpg" link setelah src= , yang diapit tanda petik2 merupakan link tempat lo menyimpan gambar.

Mungkin gambar diatas ukurannya terlalu besar yak! Untuk menyesuaikan ukuran gambar, kita dapat menggunakan atribut width dan height. Dalam penggunaan atribut width dan height, selalu atur sesuai rasio gambar asli. Misal rasio gambar asli 1:1, ya pengatauram width dan height tetep 1:1. Jika lo gunain rasio berbeda, nanti tampilan gambarnya kurang maksimal.

Contoh:

<img src="https://storage.googleapis.com/takeapp/media/cm07mfpdv00020cl3ee8x7z1p.jpg" width="100" height="100">

Hasilnya:

Atribut width diatas fungsinya untuk mengataur ukuran lebar gambar, sedang height untuk mengatur tinggi gambar.

OK, sampai sini udah paham belum? Jika belum atau ada penjelasan gue yang kurang tepat, silahkan komentar dibawah. Sekian dan wassalam.