Link: untuk mengaitkan antara dokumen yang satu dengan yang lainnya. Bisa juga mengaitkan blok-blok dalam satu dokumen
- Menciptakan link: didefinisikan dengan menggunakan pasangan tag <a> dan </a>. selain itu diperlukan juga atribut href untuk menyatakan tujuan link.
- Atribut link: selain atribut href diatas, terdapat atribut lain yakni target dan title. Atribut target digunakan untuk mengatur apakah link akan dibuka pada window yang sama atau window yang baru (new tab). Sedangkan atribut title digunakan untuk menampilkan teks ketika kursor mouse berada di atas link.
- Link internal: digunakan untuk menuju blok kalimat, sub bahasan atau paragraph yang ada dalam satu dokumen. Didefinisikan dengan id. Dalam pembuatannya, langkah pertama adalah member prefix # pada atribut href. Kemudian menetapkan nilai yang sama dengan href tetapi tanpa prefix.
- Link e-mail: didefinisikan dengan menambah prefix mailto di depan URL alamat email.
- Link gambar: didefinisikan dengan tag <img> yang terletak diantara tag <a>
<img src=”google.jpg” border=”0”/>
</a>
Table
- Menciptakan table: diawali dengan tag <table>, kemudian di ikuti dengan tiga tag dasar:
- Tag <th> atau table heading, mendefinisikan header
- Tag <tr> atau table row, mendefinisikan baris.
- Tag <td> atau table data, mendefinisikan sel.
- Pemformatan table: didefinisikan dengan tiga atribut yaitu align (untuk mengatur posisi), cellspacing (untuk mengatur spasi antar sel) dan cellpadding (untuk mengaturspasi antara border sel dengan isi. Atribut lainnya adalah width (untuk menentukan lebar table atau sel).
- Penggabungan sel: dapat dilakukan berdasar baris (rowspan) atau kolom (colspan)
- Frame: untuk menciptakan frame terlebih dahhulu menciptakan tipe baru yang disebut frameset. Didefinisikan dengan <frameset> dan </frameset> kkemudian di ikuti <frame>.
Berikut contoh aplikasi uraian di atas:
<!DOCTYPE html
PUBLIC "--//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"xml:lang="en" lang="en">
<head>
<title>Grafik Berbasis Tabel</title>
</head>
<body>
<br/>
<hr style="background-color:#000000" align="left" width="750" size="3"/>
<table border=0 cellspacing=5>
<tr>
<th width="200" >Perusahaan</th>
<th width="600">Pendapatan</th>
</tr>
</table>
<hr style="background-color:#000000" align="left" width="750" size="3"/>
<table border=0 cellspacing=5>
<tr>
<td width="300">Angin Reboot Ltd.</td>
<td width="150"></td>
<td width="150" bgcolor="green"></td>
<td>+150%</td>
</tr>
</table>
<table border=0 cellspacing=5>
<tr>
<td width="300">Command Prompt, Inc</td>
<td width="150"></td>
<td width="55" style="border-color:#000000" bgcolor="#00CC00"></td>
<td>+55%</td>
</tr>
</table>
<table border=0 cellspacing=5>
<tr>
<td width="300">Hibernate Ltd</td>
<td width="127" align="right">-23%</td>
<td width="23" bgcolor="yellow"></td>
</tr>
</table>
<table border=0 cellspacing=5>
<tr>
<td width="300">Shutdown Ltd</td>
<td width="75" align="right">-75%</td>
<td width="75" bgcolor="red"></td>
</tr>
</table>
<hr style="background-color:#000000" align="left" width="750" size="3"/>
<br/>
Menuju Blog Zo3. Klik pada gambar
<a href="acilsuracil.blogspot.com" title="Blog acil">
<img src="frog.gif" border="0"/>
</a>
</body>
0 komentar:
Posting Komentar