Atribut background digunakan untuk
membuat sebuah gambar menjadi latar dari halaman.
Sedangkan bgcolor digunakan untuk
menset warna dari latar halaman website. Kali ini yang
akan dibahas hanyalah tag bgcolor
karena tag background
nilainya sama dengan tag image yang akan dibahas kemudian.
Ketik kode di
bawah ini
<head>
<title>Atribut dari Tag Image</title>
</head>
<body bgcolor="#000000" link="http://www.google.com">
<font color="#ffffff" face="verdana"><p><b>Ini body dengan bgcolor="#000000" atau samadengan
"black"</b><br> dan font color diset ="#ffffff" atau samadengan
"white".</p><p>Di dalam html anda dapat menggunakan perpaduan warna antara
angka dan huruf seperti "#cgcgcg" akan menghasilkan warna
abu-abu.</p>
</body>
</html>
</body>
</html>
Gambar Output file tag_body.html
Dan suatu waktu
anda tentu ingin menambahkan gambar didalam website anda.
Untuk menampilkan gambar
pada halaman dapat digunakan tag <img>. Format file
yang dapat didukung oleh tag img
bermacam-macam mulai BMP, JPG, GIF, TGA dan lain-lain.Tag
img memiliki beberapa atribut
yaitu
‐ src : letak file gambar yang akan
ditampilkan
‐ border: tebal bingkai gambar
‐ height: menentukan tinggi image/gambar
‐ width: menentukan lebar image/gambar
Nilai dari atribut src jika letak file gambar
berada pada direktori yang sama dengan direktori file html anda. Maka cukup
tuliskan nama filenya saja, contohnya src=”nama_file.jpg”. Dan
jika letak filenya berada pada sub folder/direktori maka nilainya adalah src=”sub_folder/nama_file.jpg”.
Lalu bagaimana jika letaknya pada folder/direktori diatas file html saya?.
Caranya hampir sama hanya saja ditambahkan tanda ../(titik dua dan slash). Yang
artinya pindah satu folder keatas, jika letaknya di dua folder diatas file html
saya. Sama tinggal menambah ../../ (artinya pindah dua folder ke atas).
Contohnya
src=”../nama_folder/nama_file.jpg”.
Untuk contoh kali ini masuklah ke direktori/folder HTML
yang telah anda buat sebelumnya.
Buatlah satu buah folder dalam direktori HTML tersebut.
Dan berilah nama folder itu gambar. Lalu copykan satu gambar apa
saja kedalam folder gambar tersebut.
Lalu
ketiklah kode berikut ini. Ingat ganti nilai dari src sesusai
dengan nama file gambar anda.
<html>
<head>
<head>
<title>Atribut dari Tag img</title>
</head>
<body>
<p><b>Tag img hanya dengan atribut <i>src</i></b></p>
<img src="../gambar/e-book.jpg">
<p><b>Tag img dengan border="1"</b></p>
<img src="../gambar/e-book.jpg" border="1"</b><p>
<p><b>Tag img dengan height dan width</b></p>
<img src="../gambar/e-book.jpg" border="1" height="300" width="200
</body>
</html>
</body>
</html>
Lalu simpan dengan nama tag_img.html dan jalankan. Maka
output-nya akan terlihat seperti
Gambar
0 komentar:
Posting Komentar