Menggunakan Fungsi Img Src

By Surya R. Labetubun - October 23, 2011

Menyematkan gambar unik, lucu, atau indah juga menjadi salah satu hal yang mesti dipertimbangkan agar halaman web menjadi lebih menarik. Terkadang penyematan gambar juga membantu dalam menjelaskan sesuatu yang ingin disampaikan.

Penyematan gambar pada halaman web dapat dilakukan dengan menggunakan tag <IMG>. Tag image atau <IMG> memiliki beberapa atribut. Namun, atribut yang selalu digunakan adalah <IMG SRC="isi lokasi gambar berada">. Ekstensi yang dimungkinkan untuk ditampilkan antara lain JPEG, TIFF, JPG, BMP, GIF, dan PNG.

- MENAMPILKAN GAMBAR
Contoh penggunaannya sebagai berikut:
<html>
<head>
<title>menampilkan gambar</title>
</head>
<body>
<IMG SRC="kim nam gil.jpg">
</body>
</html>




- MENAMPILKAN GAMBAR YANG BERASAL DARI SITUS LAIN
Contoh penggunaannya sebagai berikut:
<html>
<head>
<title>menampilkan gambar</title>
</head>
<body>
<IMG SRC="http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash4/303208_274250005939888_100000646737879_919441_930124859_n.jpg">
</body>
</html>


- MENAMPILKAN GAMBAR YANG BERADA PADA FOLDER TERTENTU
Contoh penggunaannya sebagai berikut:
<html>
<head>
<title>menampilkan gambar</title>
</head>
<body>
<IMG SRC="/media/Dark Yuna/Blitz/All About K/Kakashi Hatake/Team_Kakashi.jpg">
</body>
</html>


- MENAMPILKAN GAMBAR DENGAN ATRIBUT ALT
Dengan atribut ini tampilan teks dapat terlihat sebagai pengganti gambar bila suatu waktu gambar - karena satu dan lain hal - tidak bisa ditampilkan. Misalnya user menggunakan web browser versi lama (yang belum bisa menampilkan gambar) atau web browser yang dimatikan fungsi penampil gambarnya (untuk mempercepat proses loading).

Contoh penggunaannya sebagai berikut:
<html>
<head>
<title>menampilkan gambar</title>
</head>
<body>
<IMG SRC="kerokeroppi.jpg" ALT="ini adalah gambar kerokeroppi">
</body>
</html>





- MENAMPILKAN GAMBAR DENGAN MENENTUKAN LEBAR GAMBAR
Contoh penggunaannya sebagai berikut:
<html>
<head>
<title>menampilkan gambar</title>
</head>
<body>
<IMG SRC="kim nam gil.jpg" WIDTH="45%">
</body>
</html>




- MENAMPILKAN GAMBAR DENGAN MENENTUKAN TINGGI GAMBAR
Contoh penggunaannya sebagai berikut:
<html>
<head>
<title>menampilkan gambar</title>
</head>
<body>
<IMG SRC="kerokeroppi.jpg" HEIGHT=300>
</body>
</html>




- MENAMPILKAN GAMBAR DENGAN MENENTUKAN PERATAAN GAMBAR
Pengaturan perataan gambar memiliki beberapa nilai atribut, yakni: TOP, MIDDLE, BOTTOM, LEFT, dan RIGHT.

Contoh penggunaannya sebagai berikut:
<html>
<head>
<title>menampilkan gambar</title>
</head>
<body>
<IMG SRC="kerokeroppi.jpg" ALIGN="RIGHT">
</body>
</html>




- MENAMPILKAN GAMBAR DENGAN MEMBERI GARIS TEPI PADA GAMBAR
 Atribut ini digunakan untuk memberi efek bingkai pada gambar. Jika nilai atribut border=0, maka gambar tidak akan memiliki garis tepi.

Contoh penggunaannya sebagai berikut:
<html>
<head>
<title>menampilkan gambar</title>
</head>
<body>
<IMG SRC="kakashi.jpg" BORDER="2">
</body>
</html>





- MENGGUNAKAN GAMBAR SEBAGAI LINK
Contoh penggunaannya sebagai berikut:
<html>
<head><title>menampilkan gambar</title></head>
<body>
<A HREF="http://www.uyayunahatake-on.blogspot.com"> <IMG SRC="kakashi.jpg"></A>
</body>
</html>



  • Share:

You Might Also Like

0 comments