List dan Image - Ramos` Blog
Download
Report
Transcript List dan Image - Ramos` Blog
Enumerasi, Images & Table
List item di gunakan untuk mengelompokkan data baik
berurutan (ordered list) maupun yang tidak
berurutan (unordered list).
Ada tiga macam list yang bisa anda tambahkan ke
document HTML:
1. Unordered List (Bullet)
2. Ordered List (Numbering)
3. Definition List
Berbeda dengan ordered list dan unordered list,
pada definition list tidak menggunakan tanda
khusus (numbering maupun bulleting) pada itemitem sebuah list.
Definition list umumnya digunakan untuk sebuah
artikel pada HTML yang isinya merupakan uraian
umum mengenai suatu hal yang berkaitan dengan
ilmu pendidikan dan ilmiah.
Untuk membuat sebuah definition list, web designer dapat
menggunakan tag <dl> (definition list) yang ditutup dengan
tag </dl>. Berbeda dengan ordered maupun unordered list
yang menggunakan tag <li>, maka pada definition list
digunakan tag <dt> untuk memasukan item-item pada list
yang bersangkutan dan diakhiri dengan tag </dt>.
Kemudian jika ingin memasukan sub-item pada list tersebut
maka dapat menggunakan tag <dd> dan </dd>.
<hr>
membentuk garis pemisah mendatar.
Bentuk penulisan lain yang dianjurkan (XML style) :
<hr />
Digunakan untuk memberikan warna/image
latar belakang pada elemen html
Bisa ditempatkan pada elemen html seperti
<body> <table> <tr> <td>, dll..
Tag yang digunakan
Menggunakan warna:
▪ <body bgcolor="#000000">
▪ <body bgcolor="rgb(0,0,0)">
▪ <body bgcolor="black">
Menggunakan image:
▪ <body background="clouds.gif">
<img src="NamaFileGambar">
Atribut src digunakan untuk menentukan source dari image
yang akan ditampilkan.
Image: ekstensi .GIF, .JPG, atau .PNG.
Value lokasi image bisa merujuk ke absolute path
src = ”c:/gambar/logo.gif”
src = http://www.google.co.id/intl/id_id/images/logo.gif
Value lokasi image bisa juga merujuk ke relative path
src=”images/logo.gif”
src=”../../images/logo.gif”
Atribut alt
Alt digunakan untuk mendefinisikan alternate text
untuk sebuah image
Contoh : <img src="boat.gif" alt="Big Boat">
Alt juga akan memberitaukan kepada pengunjung
web bila gambar yang apa yang sedang
ditampilkan bila gambarnya tidak muncul
Atribut align
Gunakan atribut align untuk mentukan posisi dari gambar
bila diletakan dalam paragraf (tag <p> </p> )
Value dari align : absbottom, absmiddle, baseline, bottom,
left, middle, right, texttop, top
Contoh : <p> Fakultas Teknologi Informasi <img
src=”logo.gif” align=”bottom”> UKSW</p>
Atribut width dan height
Digunakan untuk menyesuaikan besar image
Width (lebar) dan height (tinggi) didefinisikan
dalam bentuk pixel.
<p>
<img src ="logo.gif"
align ="left" width="48px" height="48px">
A paragraph with an image. The align attribute of
the image is set to "left". The image will float to
the left of this text.
</p>
Image juga bisa digunakan untuk
menggantikan teks pada link
Contoh : <a href=”http://www.google.com”><img
src=”logo.gif” border=”0”></a>
Perhatikan atribut border=”0” digunakan
untuk mengilangkan border pada image yang
akan muncul secara otomatis bila image
digunakan pada link
<table> definisi tabel </table>
Tag untuk penanda baris adalah <tr> definisi
baris </tr>
Tag untuk penanda kolom adalah
<td>data</td>
Blog: ramos672006005.wordpress.com