Latihan Pertama <html> <head> <title> Latihan Pertamaku </title> </head> <body bg color=”#000000?> <p align=”left”> Paragraf ini akan rata kiri<br> Paragraf ini akan rata kiri<br> Paragraf ini akan rata kiri<br> <p> br digunakan untuk ganti baris <br><br> <b>Kalimat ini akan dicetak Bold </b> <br> <i>Kalimat ini akan dicetak Italic </i> <br> <b><i>Kalimat ini akan dicetak Bold dan Italic</i></b> <hr width=”1000?><br> Perintah hr digunakan untuk membuat garis </body> </html> Hasilnya :Latihan Tabel 1
<html> <head> <title>Latihan Table 1</title> </head> <body> <table width=”100%” height=”100%” border=”1? > <tr> <td align="center">1</td> <td align="center">2</td> <td align="center">3</td> </tr> <tr> <td align="center">4</td> <td align="center">5</td> <td align="center">6</td> </tr> <tr> <td align="center">7</td> <td align="center">8</td> <td align="center">9</td> </tr> </table> </body> </html>
Latihan Tabel 2
<html> <head> <title>Latihan Table 2</title> </head> <body> <table width=”100%” height=”100%” border=”1? > <tr> <td align="center">1</td> <td colspan=”2? align="center">2</td> </tr> <tr> <td align="center">3</td> <td align="center">4</td> <td align="center">5</td> </tr> <tr> <td colspan=”2? align="center">6</td> <td align="center">7</td> </tr> </table> </body> </html> Hasilnya :Latihan Tabel 3
<html>
<head>
<title>Latihan Table 3</title>
</head><body> <table width=”100%” height=”100%” border=”1?> <tr> <td colspan=”3? align="center">1</td> </tr> <tr> <td colspan=”2? align="center">2</td> <td align="center">3</td> </tr> <tr> <td align="center">4</td> <td align="center">5</td> <td align="center">6</td> </tr> </table> </body> </html>Hasilnya :
<html>
<head> <title>Latihan Table 4</title> </head> <body> <table width=”100%” height=”100%” border=”1? > <tr> <td rowspan=”2? align="center">1</td> <td align="center">2</td> </tr> <tr> <td align="center">3</td> </tr> </table> </body> </html>
<html> <head> <title>Latihan Table 5</title> </head> <body> <table width=”100%” height=”100%” border=”1? > <tr> <td align="center">1</td> <td rowspan=”2? align="center">2</td> </tr> <tr> <td align="center">3</td> </tr> </table> </body> </html>
Hasilnya :
Latihan Tabel 6
<html><head>
<title>Latihan Table 6</title>
</head>
<body>
<table width=”100%” height=”100%” border=”1? >
<tr>
<td align="center">1</td>
<td colspan=”2? align="center">2</td>
</tr>
<tr>
<td rowspan=”2? align="center">3</td>
<td colspan=”2? align="center">4</td>
</tr>
<tr>
<td align="center">5</td>
<td align="center">6</td>
</tr>
<tr>
<td rowspan=”2? align="center">7</td>
<td align="center">8</td>
<td rowspan=”2? align="center">10</td>
</tr>
<tr>
<td align="center">9</td>
</tr>
</table>
</body>
</html>
Hasilnya :
Latihan Pertemuan 2:
<html><head>
<title> Latihan Pertemuan 2 </title>
</head>
<body bgcolor="#000000" text="#FFFFFF">
<table border="1" align="center" width="80%">
<tr>
<td colspan="2"align="center"heigth="75%"bgcolor="pink">
<font size="16"face="chiller">SITUSKU.COM</font><br>
<hr width="500"><br>
<marquee direction="right">Terdepan Dalam Berita dan Gosip</marquee>
</td>
</tr>
<tr valign="top">
<td width="200"height="450"bgcolor="green">Home</td>
<td bgcolor="#F75454"><font size="13"face="batang">Welcome<b><i>SITUSKU.COM</i></b><br>
Situsku.Com akan selalu konsisten dengan berita - berita terbaru dari segala penjuru Indonesia.<br><br>
Dapatkan berita - berita menarik tentang : politik, hukum, keamanan, gosip artis, dan kuliner Indonesia.
</td>
</tr>
</table>
</body>
Latihan Pertemuan 3:
<html><head>
<title>Latihan Pertemuan 3</title>
<body bgcolor="violet">
<table border="1" align="center" width="100%">
<tr>
<td colspan="2" align="center" height=”100">
<font size=”15?>Wulan's Web</font><br>
<hr width=”800?><br>
<font face=”comic sans ms” size=”5" color="yellow">
<marquee direction=”right”> "kita pasti bisa..!!"</marquee>
</font></td></tr>
<tr valign=”top”>
<td width=”100? height=”450?>
<a href=”latihan pertemuan 3.html”>Home</a>
<br><a href=”profile.html”>Profile</a>
<br><a href=”gallery.html”>Gallery</td>
<td><img src="doraemon1.jpg" width=”80%” height=”60%”>
<br><font size="5" face="Harrington"> </td>
</tr>
<tr>
<td colspan=”2? align="center”>
Copyright © Wulan's Web
<br>All right reserved 2009</td></tr>
</table>
</body
</html>
Hasilnya :<head>
<title> Ordered List</title>
</head>
<body>
<ol type=”A”>
<li>Jeruk</li>
<li>Nanas</li>
<li>Melon</li>
<li>Jambu</li>
</ol>
</body>
</html>
Hasilnya :
Latihan List2 :
<html><head>
<title> Unordered List</title>
</head>
<body>
<ul type=”square”>
<li>Es Campur</li>
<li>ES Jeruk</li>
<li>Es Nanas</li>
<li>Es Teh</li>
</ul>
</body>
</html>
Hasilnya :
Latihan List3 :
<html><head>
<title> List 3</title>
</head>
<body> Siswa dan Hobinya:
<ol type=”1?>
<li>Hobbi Riska Anjana:</li>
<ul type=”disc”>
<li>Membaca Komik</li>
<li>Nonton Film</li>
</ul>
<li>Hobbi Cinta:</li>
<ul type=”square”>
<li>Menyanyi</li>
<ol type=”a”>
<li>Lagu Campursari</li>
<li>Lagu Pop</li>
</ol>
<li>Shopping</li>
</ul>
<li>Hobbi Siska</li>
<ul type=”circle”>
<li>Menari</li>
<li>Memasak</li>
</ul>
</ol>
</body>
</html>
Hasilnya :
Latihan From 1:
<html><head>
<title> Form 1 </title>
</head>
<body>
<form>
Nama : <input name=”teks1?> <br><br>
Kelas: <input name=”teks2? maxlength=”2?> <br><br>
No : <input value="10"> <br><br>
Hobby: <input name=”teks4? size=”8?> <br><br>
Password: <input name=”teks5?>
</form>
</body>
</html>
Hasilnya :
Latihan From 2 :
<html><head>
<title> Form 2 </title>
</head>
<body>
<form name="data" action="form_1.html" method="post">
Nama-nama Guruku: <br><br>
<input type="checkbox" name="c1"> Pak Samino <br>
<input type="checkbox" name="c1" Checked> Pak Arifin <br>
<input type="checkbox" name="c1"> Pak Maryono <br>
<input type="checkbox" name="c1"> Pak Reza <br>
<input type="checkbox" name="c1"> Bu Gandhi <br><br>
Pelajaran favoritku: <br><br>
<input type="radio" name="r1"> Matematika <br>
<input type="radio" name="r1" checked> Fisika <br>
<input type="radio" name="r1"> Kimia <br>
<input type="radio" name="r1"> Biologi <br>
<input type="radio" name="r1"> Sejarah <br><br>
Situs Pilihanku: <br><br>
<select name="s1">
<option> Detik.Com </option>
<option selected> Kapanlagi.Com </option>
<option> Kickandy.Com </option>
<option> Friendster.Com </option>
<option> Debritto.Net </option>
</select> <br><br>
Silahkan tuliskan komentar Anda di bawah ini: <br><br>
<textarea name="kesan" rows="5" cols="20">
Masukkan komentar di sini !!!
</textarea> <br><br>
<input type="submit" value="kirimkan"><br>
<input type="reset" value="ulangi"><br>
</form>
</body>
</html>
Hasilnya :
Latihan From 3 :
<html><head>
<title>Latihan Form 3</title>
<body>
<center>
<font size="15">Data Siswa</font></center><br>
<hr width="400">
<form>
<table border="0">
<tr>
<td>Nama Lengkap</td>
<td><input type="text" name="text1"></td></tr>
<tr>
<td>Nama Panggilan</td>
<td><input type="text" name="text2></td></tr>
</table>
<table border="0">
<tr>
<td>Agama</td>
<td><select name="s1">
<option>Islam</option>
<option>Khatolik</option>
</select></td></tr>
<tr>
<td>Jenis Kelamin</td>
<td><select name="s2">
<option>Laki-laki</option>
<option>Perempuan</option>
</select></td></tr>
<tr>
<td>Alamat</td>
<td><textarea name="alamat" rows="5" cols="20"></textarea></td></tr>
<tr>
<td>Hobby</td>
<td><input type="radio" name="r1">Membaca
<input type="radio" name="r1">Menulis
<input type="radio" name="r1">Menyanyi</td></tr>
<tr>
<td>Makanan Favorit</td>
<td><input type="checkbox" name="c1">Soto
<input type="checkbox" name="c1">Bakso
<input type="checkbox" name="c1">Nasi Goreng</td></tr>
<tr>
<td><input type="submit" value="SUBMIT">
<input type="reset" value="RESET"><br></td></tr>
</table>
</form>
</body>
</html>
Hasilnya :
Latihan From 4 :
<html>
<head>
<title>Latihan Form 4</title>
<body>
<form>
<table width=”75%” height=”75%” border=”1? >
<tr>
<td colspan=”2? align=”center”>YAHOO!MAIL, Get Your Yahoo! ID</td></tr>
<tr>
<td>*First name</td>
<td><input name=”text1?></td></tr>
<tr>
<td>*Last name</td>
<td><input name=”text1?></td></tr>
<tr><td width=”150?>*Preferred content:</td>
<td><select>
<option selected>Yahoo!U.S</option><option>Google</option></select></td></tr>
<tr>
<td>*Gender:</td>
<td><select>
<option>Male</option>
<option>Female</option></select></td></tr>
<tr>
<td>*Yahoo!ID</td>
<td><input name=”text1?></td></tr>
<tr>
<td colspan=”2? align=”center”>ID may constan of a-z,0-9,underscore etc</td></tr>
<tr>
<td>*Password:</td>
<td><input name=”pass”></td></tr>
<tr>
<td>*Re-type Password:</td>
<td><input name=”pass2?></td></tr>
<tr>
<td><input value=”SUBMIT”></td>
<td><input value=”RESET”></td></tr>
</table>
</form>
</body>
Tugas HTML
Desember 19, 2009 oleh wulanxtkj1Hello world!
Juli 29, 2009 oleh wulanxtkj1Welcome to WordPress.com. This is your first post. Edit or delete it and start blogging!















