FORMAT TAMPILAN GAMBAR
Format gambar yang sering digunakan dalam halaman web adalah
1. GIF ( Graphics Interface Format)
2. JPEG (Joint Photographic Expert Group )
3. PNG (.png = Portable Network graphics)
Contoh:
<html>
<head>
<title>Gambar</title>
</head>
<body bgcolor="f0f0f0">
<h2><p>Latihan Menambahkan Gambar GIF, JPG, dan PNG</p></h2>
<p>Menampilkan gambar dalam format GIF:</p>
<img src="web 5/7.gif"/ height="150 pixel" width="250 pixel">
<p>Menampilkan gambar dalam format JPG:</p>
<img src="web 5/5.jpg"/ height="150 pixel" width="250 pixel">
<p>Menampilkan gambar dalam format PNG:</p>
<img src="web 5/6.jpg"/ height="150 pixel" width="250 pixel">
</body>
</html>
coding diatas akan menghasilkan gambar seperti dibawah ini
Menggabung Gambar dan Teks
Menggabungkan Gambar Secara Vertikal (tugas 1)
codingnya:
<html>
<head>
<title>GAMBAR</title>
</head>
<body bgcolor="#f0f0f0">
<h1><p>MENGGABUNGKAN GAMBAR DAN TEKS,POSISI TERHADAP TEKS SECARA VERTIKAL</p></h1>
<h2><img align="top" src="web 5/4.jpg"/ height="150 pixel" width="250 pixel"<p>GAMBAR 1 (MENGGUNAKAN ALIGN TOP)</p></h2>
<h2><img align="middle" src="web 5/5.jpg"/ height="150 pixel" width="250 pixel"<p>GAMBAR 2 (MENGGUNAKAN ALIGN MIDDLE)</p></h2>
<h2><img align="bottom" src="web 5/6.jpg"/ height="150 pixel" width="250 pixel"<p>GAMBAR 3 (MENGGUNAKAN ALIGN BOTTOM)</P></h2>
</body>
</html>
coding diatas akan menampilkan hasil seperti gambar dibawah ini.
Menggabungkan Gambar Secara Horisontal (tugas 2)
codingnya:
<html>
<head>
<title>GAMBAR</title>
</head>
<body bgcolor="#f0f0f0">
<h1><p>MENGGABUNGKAN GAMBAR DAN TEKS,POSISI TERHADAP TEKS SECARA HORISONTAL</p></h1>
<h2><img align="left" src="web 5/3.jpg"/ height="250 pixel" width="350 pixel"<p>GAMBAR 1 (MENGGUNAKAN ALIGN LEFT)</p></h2>
<h2><img align="right"src="web 5/2.jpg"/ height="250 pixel" width="350 pixel"<p>GAMBAR 2 (MENGGUNAKAN ALIGN RIGHT)</p></h2>
</body>
</html>
coding diatas akan menampilkan hasil seperti gambar dibawah ini.
MEMBERI KETERANGAN PADA GAMBAR
codingnya:
<html>
<head>
<title>GAMBAR</title>
</head>
<body bgcolor="#f0f0f0">
<h1><p>MENYAJIKAN FORMAT GAMBAR DENGAN KETERANGAN</p></h1>
<h2><img src="web 5/1.jpg" title="jung chanwoo IKON"/height="500 pixel" width="600 pixel"></h2>
</body>
</html>
coding diatas akan menampilkan hasil seperti gambar dibawah ini.
Komentar
Posting Komentar