Pertemuan II
Cara pembuatan table pada html
<html>
<head>
<title>latihan 1</title>
</head>
<body>
<table border=3px>
<tr>
<td> </td>
</tr>
</body>
</html>
Table diatas terdiri atas 1 baris dan 1 kolom.
<tr> = menyatakan banyak baris
<td> = menyatakan banyak kolom
Border = menampilkan border pada table
Membuat Table 2 baris dan 2 kolom
<html>
<head>
<title>latihan 1</title>
</head>
<body>
<table bordercolor='red' border='3px' width=50%
height=50%>
<tr>
<td
colspan=2> </td>
</tr>
<tr>
<td >
<height
= 30% >
</td>
<td >
<height
= 30%>
</tr>
</table>
</body>
catatan :
Bordercolor digunakan untuk mewarnai border ada tabel
Width dan height digunakan untuk mengatur lebar dan tinggi
tabel pada website
Membuat tabel 3 baris dan
kolom
<html>
<head>
<title>latihan 1</title>
</head>
<body>
<table bordercolor='red' border='3px' color='red'
width=50% height=50%>
<tr>
<td
rowspan=2 > 1,1 </td>
<td
colspan=2> 1,2 </td>
</tr>
<tr>
<td> 2,1
</td>
<td> 1,2
</td>
</tr>
<tr>
<td colspan = 3
> 3,1 </td>
</tr>
</table>
</body>
</html>
Membuat tabel 4 baris 3 kolom
<html>
<head>
<title>latihan
1</title>
</head>
<body>
<table bordercolor='red'
border='3px' color='red' width=50% height=50%>
<tr>
<td
colspan=2> 1,1 </td>
<td>
1,3 </td>
</tr>
<tr>
<td> 2,1 </td>
<td> 1,2 </td>
</tr>
<tr>
<td colspan = 2 > 3,1 </td>
</tr>
<tr>
</tr>
<td
colspan = 2> 4,1 </td>
</table>
</body>
</html>
Membuat
<html>
<head>
<title> PERTEMUAN II
</title>
</head>
<body
bgcolor="green">
<table border = "1px"
width="70%" align="center"height="90%"
bgcolor="red">
<tr>
<td
valign="top"align="center"colspan="4">
<font color="BLUE"size="+2"><blink>Google</blink></font>
<br><br>
<form>
<input type=text size=30>
<input type= submit
value="Search">
</form>
</td>
</tr>
<tr>
<td>
<marquee
direction="left"><img src ="koala.jpg
"width="50px"height="50px"</marquee>>
<a href=prak1.html><blink>prak-1</blink></a>
</td>
<td>
<img src ="desert.jpg
"width="50px" height="50px">
<a
href=prak3.html><blink>prak-2</blink></a>
</td>
<td>
<img src ="lighthouse.jpg
"width="50px" height="50px">
prak-3
</td>
<td>
<img src ="penguins.jpg "width="50px" height="50px">
prak-4
</td>
</td>
</tr>
</table>
</body>
</html>

0 comments:
Post a Comment