Iklan Banner
banner 468 pixel

Info Bisnis Online

Minggu, 30 Agustus 2009

Kode HTML untuk menampilkan gambar (images)

Ngga seru posting blog kalo ngga menyisipkan gambar-gambar. Secara default, posting di blogger.com disediakan menu untuk meng-upload gambar dari PC. Namun ada kalanya kita perlu menambahkan gambar dari halaman website lain. Bagaimana menulis kode HTML untuk menampilkan gambar (images)?

Pertama-tama kita memerlukan lokasi gambar di suatu web server. Sebagai contoh, saya akan menyisipkan gambar logo Google pada posting ini. Lokasi gambar logo itu berada di server Google. Anda dapat dengan mudah mengetahui alamat gambar dengan membuka Google.com, kemudian meng-klik kanan logo-nya kemudian klik sub-menu Copy image location.

Lokasi gambar yang didapat adalah: http://www.google.co.id/intl/id_id/images/logo.gif

Ok..
Sekarang memulai menulis kode HTML untuk memasukan gambar itu ke dalam artikel ini. Tag HTML untuk memasukan gambar ke halaman web adalah:

<img src="http://www.google.co.id/intl/id_id/images/logo.gif" border="0" width="200" alt="Google.com"/>

hasilnya adalah..


Keterangan

src="http://...." = mencari lokasi gambar di suatu direktori dalam server suatu website.

width="200" = menyatakan lebar gambar dalam pixel

height="200" = menyatakan tinggi gambar dalam pixel - untuk menyesuaikan tinggi secara otomatis berdasarkan dimensi gambar, height tidak perlu ditulis kecuali Anda memang ingin mengatur tingginya.

alt="alternate text" = Alternate text berfungsi untuk memberikan keterangan tambahan. Jika gambar dihapus dari direktori, isi dari alternate text ini yang akan menggantikannya.

border="0" = menyatakan tebal garis. Nol (0) berarti garis tidak ditampilkan.

2 komentar:

  1. O.. Gitu.. Tpi klo kode satu digunakan untuk sejumlah gambar gimana? Contohnya, 1 kode HTML untuk 2 atau lebih gambar. Gmn caranya?
    http://rezhaxite.blogspot.com

    BalasHapus
  2. Bos klo saat mengklik gambar truss menuju ke link yang kita mau, bukannya ke link gambar gmn?

    thanks..

    BalasHapus