By default, usually in the Table will appear in the HTML browser, such as that shown in the example to create a Tags Table.
| List of Student Class IIIA | ||
|---|---|---|
| Name | Address | Date of Birth |
| Andy. R | Jl. Setia Budi, 20A | 22-4-1992 |
| Budianto | Jl. Merdeka, 23B | 12-2-1993 |
| Brandy. W | Jl. Anyelir, 11C | 10-1-1992 |
| Cyntia Dewi | Jl. Pahlawan. 10C | 13-8-1993 |
First, we create the HTML code by using its Class and ID Selector, for example:
<table border=”0″>
<tbody>
<tr>
<th colspan=”3″>List of Student Class IIIA</th>
</tr>
<tr>
<td>Name</td>
<td>Address</td>
<td>Date of Birth</td>
</tr>
<tr>
<td>Andy. R</td>
<td>Jl. Setia Budi, 20A</td>
<td>22-4-1992</td>
</tr>
<tr>
<td>Budianto</td>
<td>Jl. Merdeka, 23B</td>
<td>12-2-1993</td>
</tr>
<tr>
<td>Brandy. W</td>
<td>Jl. Anyelir, 11C</td>
<td>10-1-1992</td>
</tr>
<tr>
<td>Cyntia Dewi</td>
<td>Jl. Pahlawan. 10C</td>
<td>13-8-1993</td>
</tr>
</tbody>
</table>
Second, we make its CSS file as follows:
table.listItem {
width:100%;
padding:0.1em;
text-align:center;
border:1px #009966 solid;
background:#FFFFFF;}table.listItem th {
font-size:1.4em;}table .nameItem {
background:#006666;
font-weight:bold;
color:#FFFFFF;}table .oldRow {
background:#009999;}table .evenRow {
background: #00CC99;}
OK, download the HTML code and CSS code above, and if you see in the browser as a result will like Table above.
Congratulations ….! Testing
