Friday, January 23, 2009

menampilkan gambar pada HTML

Setelah anda pelajari cara membuat html dari kumpulan beberapa artikel sebelumnya disini
sekarang saya mau jelasin cara menampilkan gambar pada website dengan html code.

adalah kode <img src="letak file gambar"> yang perlu anda tambahkan pada pagian BODY file HTML anda untuk menampilkan gambar

sebagai contoh saya akan tambahkan menampilkan file gambar pada file yang pernah saya buat disini dalam komputer local

<body>
<html>
<head>
<title>Halaman web saya yang pertama</title>
</head>
<body>
Ini halaman web saya yang pertama.<br>
<img src="mobil.jpg">
</body>
</html>
</body>

tag diatas menjelaskan bahwa file gambar mobil yang ditampilkan berada dalam satu Folder / directory dengan file html nya. tag <br> berarti memberikan jarak 1 spasi kebawah. maka hasil dari tag diatas adalah :




contoh tag jika file gambar berada di online hosting yang bisa dilihat pada browser internet

<img src="http://www.foto.com/mobil.jpg">

Pengembangan untuk menampilkan gambar pada halaman web dengan bahasa HTML dapat ada pelajari juga cara membuat tabel yang pernah diposting disini, kebutuhan menampilkan gambar dengan HTML umumnya digunakan untuk mebuat galeri foto pada halaman web. Jika cara itu diterapkan hasilnya akan seperti berikut.


9 comments:

anoc said...

thank...

jaka dernata said...

kok gmbar nyo idk jadi gan,,?

Admin said...
This comment has been removed by the author.
Admin said...

tidak jadi gimana bro jaka, pastikan source gambar berada satu folder dengan file html-nya, atur path atau link directory jika meenempatkan di source lain ( contoh : "img src="namadirectory/namagambar.jpg"

Bima said...

makasih bro....

Anrhy Chipaz said...

kalw misalx gambarx di klik trus jdi besar...skripx bgmna bos???

Admin said...

@anrhy, tinggal upload file aslinya saya, gambar yang ingin di tampilkan tinggal tambahkan src="http://www.foto.com/mobil.jpg" width="300" height="300">

jily said...

tanks gan..

Anonymous said...

Gambarnya kok masi pecah ya mas, padahal sudah satu folder sy letak...
#fandy

Post a Comment