script menambahkan gambar animasi pada tabel html

<!DOCTYPE html>
<head>
<title>Left Color</title>
</head>
<body>
<form id="forml" name="forml" method="post"action="">
<table width="800" height="447"align="center"cellspacing="0"
<tr>
<th width="627" height="23"colspan="2" align="center"bgcolor="#FF800"><strong><font color="#000000"size="+4">WEB NUR CHASANAH
</tr>
<tr>
<th width="152" valign="top" bgcolor="#FFFF00"align="left">
<p><a href="HOME.HTML">HOME</a></p></br>
<p><a href="about me.html">ABOUT ME</a></p></br>
<p><a href="musikk.html">MY MUSIC</a></p></br>
<p><a href="my videos.html">MY VIDEOS</a></p></br>
<p><a href="my photos.html">MY PHOTOS</a></p></br>
</th>
<td height="176"align="center"valign="top"bgcolor="#FFFFFF"><p>&nbsp;</p>
<p><img src="foto/gambar.gif"></p>
</td>
</tr>
<tr>
<td height="30"colspan="2" align="center"bgcolor="#FF800"><font size="+2">Copyright © Nur Chasanah.com</td>
</tr>
</table>
</form>
</body>
</html>

script menambahkan link dan file musik dalam tabel html

<!DOCTYPE html>
<head>
<title>Left Color</title>
</head>
<body>
<form id="forml" name="forml" method="post"action="">
<table width="800" height="447"align="center"cellspacing="0"
<tr>
<th width="627" height="23"colspan="2" align="center"bgcolor="#FF800"><strong><font color="#000000"size="+4">WEB NUR CHASANAH
</tr>
<tr>
<th width="152" valign="top" bgcolor="#FFFF00"align="left">
<p><a href="HOME.HTML">HOME</a></p></br>
<p><a href="about me.html">ABOUT ME</a></p></br>
<p><a href="MY MUSIC.html">MY MUSIC</a></p></br>
<p><a href="video.html">MY VIDEOS</a></p></br>
<p><a href="my photos.html">MY PHOTOS</a></p></br>
</th>
<td height="176"align="center"valign="top"bgcolor="#FFFFFF"><p>&nbsp;</p>
<p><a href="musik wav.html">audio dengan format wav</a></p></br>
<p><a href="musik mp3.html">audio dengan format mp3</a></p></br>
<p><a href="musik ogg.html">audio dengan format ogg</a></p></br>
<p>SEMUA AUDIO DENGAN FORMAT BERBEDA BEDA</p>
<p><audio controls><source src="audio/Rekamanku.ogg" type="audio/ogg"></p>
<p><audio controls><source src="audio/Rekamanku.mp3" type="audio/mp3"></p>
<p><audio controls><source src="audio/Rekamanku.ogg" type="audio/ogg"></p>
</td>
</tr>
<tr>
<td height="30"colspan="2" align="center"bgcolor="#FF800"><font size="+2">Copyright © Nur Chasanah.com</td>
</tr>
</table>
</form>
</body>
</html>

script untuk menambahkan video dalam sebuah tabel html

<!DOCTYPE html>
<head>
<title>Left Color</title>
</head>
<body>
<form id="forml" name="forml" method="post"action="">
<table width="800" height="447"align="center"cellspacing="0"
<tr>
<th width="627" height="23"colspan="2" align="center"bgcolor="#FF800"><strong><font color="#000000"size="+4">WEB NUR CHASANAH
</tr>
<tr>
<th width="152" valign="top" bgcolor="#FFFF00"align="left">
<p><a href="HOME.HTML">HOME</a></p></br>
<p><a href="about me.html">ABOUT ME</a></p></br>
<p><a href="my music.html">MY MUSIC</a></p></br>
<p><a href="my videos.html">MY VIDEOS</a></p></br>
<p><a href="my photos.html">MY PHOTOS</a></p></br>
</th>
<td height="176"align="center"valign="top"bgcolor="#FFFFFF"><p>&nbsp;</p>
<video width="100" height="100" controls><source src="VIDEO/WIN_20161024_122525.mp4" type="audio/mp4"></video>
<p>Video dengan Format mp4</p>
</td>
</tr>
<tr>
<td height="30"colspan="2" align="center"bgcolor="#FF800"><font size="+2">Copyright © Nur Chasanah.com</td>
</tr>
</table>
</form>
</body>
</html>

script menambahkan link kedalam tabel video

<!DOCTYPE html>
<head>
<title>Left Color</title>
</head>
<body>
<form id="forml" name="forml" method="post"action="">
<table width="800" height="447"align="center"cellspacing="0"
<tr>
<th width="627" height="23"colspan="2" align="center"bgcolor="#FF800"><strong><font color="#000000"size="+4">WEB NUR CHASANAH
</tr>
<tr>
<th width="152" valign="top" bgcolor="#FFFF00"align="left">
<p><a href="HOME.HTML">HOME</a></p></br>
<p><a href="about me.html">ABOUT ME</a></p></br>
<p><a href="my music.html">MY MUSIC</a></p></br>
<p><a href="my videos.html">MY VIDEOS</a></p></br>
<p><a href="my photos.html">MY PHOTOS</a></p></br>
</th>
<td height="176"align="center"valign="top"bgcolor="#FFFFFF"><p>&nbsp;</p>
<p><a href="mp4.html">video dengan format mp4</a></p></br>
<p><a href="webm.html">video dengan format webm</a></p></br>
<p><a href="ogg.html">video dengan format ogv</a></p></br>
</td>
</tr>
<tr>
<td height="30"colspan="2" align="center"bgcolor="#FF800"><font size="+2">Copyright © Nur Chasanah.com</td>
</tr>
</table>
</form>
</body>
</html>

script menambahkan sebuah foto ke dalam tabel html

<!DOCTYPE html>
<head>
<title>Left Color</title>
</head>
<body>
<form id="forml" name="forml" method="post"action="">
<table width="800" height="447"align="center"cellspacing="0"
<tr>
<th width="627" height="23"colspan="2" align="center"bgcolor="#FF800"><strong><font color="#000000"size="+4">WEB NUR CHASANAH
</tr>
<tr>
<th width="152" valign="top" bgcolor="#FFFF00"align="left">
<p><a href="HOME.HTML">HOME</a></p></br>
<p><a href="about me.html">ABOUT ME</a></p></br>
<p><a href="MY MUSIC.html">MY MUSIC</a></p></br>
<p><a href="video.html">MY VIDEOS</a></p></br>
<p><a href="my photos.html">MY PHOTOS</a></p></br>
</th>
<td height="176"align="center"valign="top"bgcolor="#FFFFFF"><p>&nbsp;</p>
<img src="foto/Akkkuuu.jpg"><p>ini adalah foto saya</p>
</td>
</tr>
<tr>
<td height="30"colspan="2" align="center"bgcolor="#FF800"><font size="+2">Copyright © Nur Chasanah.com</td>
</tr>
</table>
</form>
</body>
</html>

ulangan jobsheet

<!DOCTYPE html>
<head>
<title>Left Color</title>
</head>
<body>
<form id="forml" name="forml" method="post" action="">
<table width="800" height="447"align="center"cellspacing="0"
<tr>
<th width="627" height="23"colspan="2" align="center"bgcolor="#FF800"><strong><font color="#000000"size="+4">WEB SEKOLAH KITA
</tr>
<tr>
<th width="152" valign="top" bgcolor="#FFFF00"align="left">
<p>Menu</p>
<p>Profil Sekolah</p>
<p>Kegiatan</p>
<p>Hubungi kami</p></th>
<td height="176"align="center"valign="top"bgcolor="#FFFFFF"><p>&nbsp;</p>
<p>ISI DARI HALAMAN WEB</p>
<p>Nama Saya Nur Chasanah</p>
<p>No Absen 20
<p>Kelas X TKJ 1</p>
<p>Alamat Ringinlarik Musuk Boyolali</p>
</td>
</tr>
<tr>
<td height="30"colspan="2" align="center"bgcolor="#FF800"><font size="+2">Copyright&copy;sekolahkita.com</td>
</tr>
</table>
</form>
</body>
</html>

tugas hal 123


Alternating index

<!DOCTYPE html>
<head>
<title>Alternating Index</title>
</head>
<body>
<form id="forml" name="forml" method="post" action="">
<table width="800" height="738" border="1" align="center">
<tr>
 <td height="248" align="center" bgcolor="#FF66CC"><font size="+1"><strong>Teks/Daftar isi</strong></font>
 </td>
 <td align="center" bgcolor="#FFFFCC"><font color="#000066" size="+7"><strong><em>Gambar</em></strong>
 </font></td>
</tr>
<tr>
 <td height="261" align="center" bgcolor="#FFFF99"><font color="#CC0000" size="+7"><strong><em>Gambar</em>
 </strong></font><font size="+7"><em></em></font></td>
 <td align="center" bgcolor="#FF66CC"><font size="1"><strong>Teks/Daftar isi</strong></font></td>
</tr>
<tr bgcolor="#996666">
 <td height="150" colspan="2" align="center"><font color="#FFFFFF"><strong><font size="+1">Lain-lain</font>
 </strong></td>
</tr>
</table>
</form>
</body>
</html>

LAYOUT SPLIT

<!DOCTYPE html>
<head>
<title>Layout Split</title>
</head>
<body>
<form id="forml" name="forml" method="post" action="">
<table width="800" height="512" border="1" align="center">
<tr>
 <td width="15%" rowspan="2" align="center" bgcolor="#99CC99"><strong>Daftar Isi</strong></td>
 <td width="67%" height="23" align="center" bgcolor="#FFCCFF"><font size="+3"><strong>Banner/Judul</strong></font></td>
 <td width="18%" rowspan="2" align="center" bgcolor="#99CC99"><strong>Daftar Isi</strong></td>
</tr>
<tr>
 <td height="456" align="center" bgcolor="#CCCCCC">
   <p>Body atau contents(isi)</p>
   <p><font color="#006600">Body atau contents(isi)</font></p>
   <p><font color="#CC0000">Body atau contents(isi)</font></p>
   <p><font color="#FFFF00">Body atau contents(isi)</font></p>
   <p><font color="#990033">Body atau contents(isi)</font></p></td>
</tr>
<tr bgcolor="#FF99FF">
 <td height="23" colspan="3" align="center">Lain-lain</td>
</tr>
</table>
</form>
</body>
</html>

tabel

<html>
<head><title>Tabel Bersarang</title></head>
<body>
<table border="1" bgcolor="orange">
<tr>
<td height=10% width=60%><table border=0 align="center">
<tr>
<td bgcolor="PURPLE" colspan="2">this table is nested inside the purple
table</td>
</tr>
<tr>
<td bgcolor="blue"><font color="blue">NUR</font></td>
<td bgcolor="white" width><font color=white>CHASANAH</font></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>

contoh script left index

<!DOCTYPE html>
<head>
<title>left index</title>
</head>
<body>
<form id="forml" name="forml" method="post" action="">
<table width="800" height="447" border="1" align="center" cellspacing="1">
<tr>
<th width="160" rowspan="3" valign="top"
bgcolor="#993366"><p>home</p>
<p>profile</p>
<p>about us</p>
<p>blog</p>
<p>contact us</p></th>
<th width="627" height="23" align="center" bgcolor="#FFFF99"><strong><font color="#CCCCCC" size="+4">electronic shop</font></strong></th>
</tr>
<tr>
<td height="176" align="center" valign="top" bgcolor="#FFFF99"><p>&nbsp;</p>
<p>Selamat datang di web kami, penjualan produk online ini adalah yang pertama di kota kami
kualitas dan harga dapat dipercaya langsung saja pesan dan menjadi langganan kami.
</p></td>
</tr>
<tr>
<td height="30" align="center" bgcolor="#FFFF99">
<font size="+2">profilkami.com</font></td>
</tr>
</table>
</form>
</body>
</html>

contoh script bottom Index

<!DOCTYPE html>
<head>
<title>top index</title>
</head>
<body>
<form id="forml" name="forml" method="post" action="">
<table width="800" height="542" border="1" align="center">
<tr>
<td height="23" align="center"
bordercolor="#FFFFFF" bgcolor="#FFFF00"><strong><font size="+5">banner
/ judul</font></strong></td>
</tr>
<tr>
<td height="457" align="center" bgcolor="#FF66CC">
<p>body atau contents (isi)</p>
<p><font color="#006600">body atau contents(isi)</font></p>
<p><font color="#CC0000">body atau contents(isi)</font></p>
<p><font color="#FFFF00">body atau contents(isi)</font></p>
<p><font color="#990033">body atau contents(isi)</font></p></td>
</tr>
<tr>
<td height="23" align="center"
bgcolor="#CCFF99"><font color="#FF0000"></strong></font><font size="+2">daftar
isi atau navigasi </font></strong></font><font color="#9966CC" size="+2">&nbsp;</font></td>
</tr>
</table>
</form>
</body>
</html>

contoh script top index

<!DOCTYPE html>
<head>
<title>top index</title>
</head>
<body>
<form id="forml" name="forml" method="post" action="">
<table width="800" height="542" border="1" align="center">
<tr>
<td height="23" align="center"
bordercolor="#FFFFFF" bgcolor="#FFFF00"><strong><font size="+5">banner
atau iklan</font></strong></td>
</tr>
<tr>
<td height="27" align="center"
bgcolor="#FFCCCC"><font color="#FF0000">Daftar isi atau navigasi</font><td>
</tr>
<tr>
<td height="457" align="center" bgcolor="#FF66CC">
<p>body atau contents (isi)</p>
<p><font color="#006600">body atau contents(isi)</font></p>
<p><font color="#CC0000">body atau contents(isi)</font></p>
<p><font color="#FFFF00">body atau contents(isi)</font></p>
<p><font color="#FF6633">body atau contents(isi)</font></p></td>
</tr>
<tr>
<td height="23" align="center"
bgcolor="#CCFF99"><font color="#9966CC">info tambahan atau lain-lain</font></td>
</tr>
</table>
</form>
</body>
</html>

tabel fast bersarang

<html>
<head><title>nested table 3</title></head>
<body>
<table border="3" cellpadding="10" collspacing="10">
<td>
sel berikut yang satu ini memiliki tabel kecil didalamnya, tabel didalam tabel.
</td>
<td><table border="3" cellspandding="3" cellspendding="3">
<td>tabel ke 2</td>
<td>tabel ke 2</td>
<tr>
<td>tabel ke 2</td>
<td>tabel ke 2</td>
</tr>
</table></td>
</table>
</body>
</html>

tabel sel

<html>
<table height="550" width="400" bgcolor="orange">
<tr>
<td><table width="350" align="center" bgcolor="yellow">table > tr > td
</tr>
<tr>
<td valign="top" height="40">table > tr > td</td></table></td>
</tr>
<tr>
<td><table width="350" align="center" bgcolor="yellow">
</tr>
<tr>
<td valign="top" height="60">table > tr > td</td></table></td>
</tr>
<tr>
<td><table width="350" align="center" bgcolor="yellow">
</tr>
<tr>
<td valign="top" height="80">table > tr > td</td></table></td>
</tr>
<tr>
<td><table width="350" align="center" bgcolor="yellow">
</tr>
<tr>
<td ><table>table > tr > td </td>
<tr>
<td valign="top" width="90" bgcolor="#89F0FF">td</td>
<td valign="top" width="150" bgcolor="#89F0FF"><table bgcolor="orange">td
</tr>
<tr>
<td width="140">table > tr > td </td>
</tr>
<tr>
<td bgcolor="white">td</td>
</tr>
<tr>
<td bgcolor="white">td</td>
</tr>
<tr>
<td bgcolor="white">td</td>
</tr>
<tr>
<td bgcolor="white">td</td>
</tr>
<tr>
<td bgcolor="white">td</td>
</tr>
</table></td>
<td valign="top" width="90" bgcolor="#89F0FF">td</table></td>
</tr>
<tr>
<td><table width="350" align="center" bgcolor="orange"></table></td>
</table></td>
</tr>
<tr>
<td><table width="355" align="center" bgcolor="yellow">
</tr>
<tr>
<td valign="top" height="30" cellspacing="15">table > tr > td</td></table></td>
</tr>
</table>
</html>

script tabel bersarang

<html>
<head><title>table bersarang</title>
</head>
<body>
<table border="1">
<tr>
<td><b>Description</b></td>
<td><b>Qty</b></td>
<td align="right"><b>Price</b></td>
<td><b>Email account note</b></td>
</tr>
<td>Email account</td>
<td align="right">10</td>
<td align="right">$9.990</td>
<td rowspan=5>
<table border="1">
<tr>
<td>Mailbox</td>
<td>10GB</td>
</tr>
<tr>
<td>Webmail</td>
<td>Yes</td>
</tr>
<tr>
<td>POP3</td>
<td>Yes</td>
</tr>
<tr>
<td>IMAP</td>
<td>Yes</td>
</tr>
<tr>
<td>Anti-Spam</td>
<td>Yes</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>FYIcenter.com Ad</td>
<td align="right">1</td>
<td align="right">$99.00</td>
</tr>
<tr>
<td>1-year Access</td>
<td align="right">1</td>
<td align="right">199.00</td>
</tr>
<tr>
<td colspan=2 align="right">shipping</td>
<td align="right">$3.99</td>
</tr>
<tr>
<td colspan=2 align="right">tax</td>
<td align="right">$15.99</td>
</tr>
</table>
</body>
</html>

script tabel dalam tabel

<html>
<head>
<title>tabel didalam tabel</title>
</head>
<body>
<table border=1 bgcolor=pink>
<tr>
<td rowspan=2>
<table border=1>
<tr>
<td>table dalam tabel</td>
</tr>
</table>
</td>
<td rowspan=2>
<table border=1>
<tr>
<td>table dalam tabel</td>
</tr>
</table>
</td>
</tr>
<tr>
</tr>
</table>
</body>
</html>

SCRIPT HTML COLSPAN DAN ROWSPAN,

<html>
<head>
<title>Tabel Dengan Colspan</title>
</head>
<body>
<table width="500" border="1">
<tr>
<th>Apel</th>
<th rowspan="2" scope="col">Jeruk</th>
<th>Mangga</th>
</tr>
<tr>
<td> Pisang</td>
<td> Nanas </td>
</tr>
</table>
</body>
</html>

Script Tabel Dengan Colspan

<html>
<head>
<title>Tabel Dengan Colspan</title>
</head>
<body>
<table width="500" border="1">
<tr>
<th scope="col">Benua</th>
<th colspan="2" scope="col">EROPA</th>
<th colspan="2" scope="col">ASIA</th>
</tr>
<tr>
<td> Negara</td>
<td> Belanda</td>
<td> Italia</td>
<td> Indonesia </td>
<td> India</td>
</tr>
</table>
</body>
</html>

SCRIPT TABEL DENGAN ROWSPAN

<html>
<head>
<title>Tabel Dengan Rowspan</title>
</head>
<body>
<table width="500" border="1">
<tr>
<th scope="col">Benua</th>
<th scope="col">Negara</th>
</tr>
<tr>
<td rowspan="4">ASIA</td>
<td>Arab Saudi</td>
</tr>
<tr>
<td>India</td>
</tr>
<tr>
<td>Indonesia</td>
</tr>
<tr>
<td>Singapura</td>
</tr>
<tr>
<td rowspan="4">EROPA</td>
<td>Belanda</td>
</tr>
<tr>
<td>Italia</td>
</tr>
<tr>
<td>Inggris</td>
</tr>
<tr>
<td>Jerman</td>
</tr>
</table>
</body>
</html>