Struktur Tabel HTML

Struktur Tabel HTML

A. Elemen Dasar Tabel

Tabel adalah salah satu metode untuk menyajikan informasi dalam halaman web. Tabel terdiri dari baris dan kolom. Baris merupakan bagian mendatar, sedangkan kolom adalah bagian vertical pada table. Pertemuan antara baris dan kolom disebut sebagai cell. Cara mendeskripsikan sebuah table dalam pemrograman web berbasis HTML dengan menggunakan syntax sebagai berikut :

<table>

 <!—isi baris dan kolom -->

</table>

 

Selanjutnya, Anda dapat menambahkan baris baru diantara tag <table> … </table> dengan script sebagai berikut :

<table>

<tr>

                <! --  isi baris ke 1

</tr>

<tr>

                <! --  isi baris ke 2

</tr>

</table>                   

Script program yang lengkap adalah sebagai berikut :

<table>

  <tr>

                                     <td> Kolom 1</td>

                                     <td>Kolom2</td>

</tr>

 

<tr>

                                     <td> Kolom 1</td>

                                     <td>Kolom2</td>

</tr>

</table>

Elemen-elemen pada script  table diatas  adalah sebagai  berikut

Nama

Fungsi

<table> … </table>

Untuk mendeskripsikan table pada halaman web

<tr> … </tr>

Untuk mendeskripsikan baris pada table

<td> .. </td>

Untuk mendeskripsikan kolom pada table

 

Contoh

Membuat Tabel dalam halaman web

<html>

<head>

<title> Struktur Tabel </title>

</head>

<body>

<center><h1>Data Siswa Rekayasa Perangkat Lunak</h1></center>

<table width=”50%” border=”1” cellspacing=”0” cellpadding=”0” align=”center”>

<tr>

<td align=”center”><strong>NIS</strong></td>

<td align=”center”><strong>NAMA</strong></td>

<td align=”center”><strong>ALAMAT</strong></td>

</tr>

<tr>

<td align=”center”>09101123</td>

<td align=”center”>SATRIAN</td>

<td align=”center”>Padang Kejai</td>
</tr>

</body>

</html>

Comments

Post a Comment

thanks

Popular posts from this blog

Aplikasi Laundry Dengan Visual Basic 6.0

Image
Untuk membuat project Sistem Informasi Loundry.. ada beberapa software yang dibutuhkan yaitu : 1. MS. Visual Studio 6 2. odbc 3.5.1 3. Crystal Report 7 atau versi terbaru 4. xampp 1.7.0 atau sejenis nya... berikut contoh projectnya  silahkan download disini dan janga lupa commentarnya ya.. supaya aplikasi yang dibuat bisa diperbaiki dari kekurangan2 yang ada...
Read more

Contoh script php lengkap

Getting the Current Date and Time <?php // get current date and time $now = getdate(); // turn it into strings $currentTime = $now["hours"] . ":" . $now["minutes"] .∝ ":" . $now["seconds"]; $currentDate = $now["mday"] . "." . $now["mon"] . "." . $now["year"]; // result: "It is now 12:37:47 on 30.10.2006" (example) echo "It is now $currentTime on $currentDate"; ?> Formatting Timestamps <?php // get date // result: "30 Oct 2006" (example) echo date("d M Y", mktime()) . " \n"; // get time // result: "12:38:26 PM" (example) echo date("h:i:s A", mktime()) . " \n"; // get date and time // result: "Monday, 30 October 2006, 12:38:26 PM" (example) echo date ("l, d F Y, h:i:s A", mktime()) . " \n"; // get time with timezone // result: "12:38:26 PM UTC&q
Read more

sambungan : Tutorial CSS step 2

Sekali Tulis, Pakai Bersama Satu dari beberapa kehebatan tekhnologi css ini - dan merupakan alasan banyak orang menyukai penggunaannya - adalah memperbolehkan kita untuk mendefinisikan sebuah style-sheet global yang dapat menerapkan aturan-aturan css tersebut untuk keseluruhan dokumen-dokumen HTML pada halaman web site anda. Keuntungannya jelas sekali, jika kita ingin mengubah tampilan situs, kita tinggal mengedit satu file saja dan hasilnya akan di refleksikan pada keseluruhan dokumen HTML yang dilink ke situ. Anggap saja anda mempunyai Style-Sheet yang diberi nama "global.css" yang diletakkan pada server "www.situskamu.com/global.css". Untuk memberikan pengaruh aturan Style-Sheet kesemua atau ke spesifik dokumen HTML, gampangnya tambahkan saja kode sederhana ini di dalam tag <HEAD> pada dokumen HTML anda, seperti ini : <HEAD> <LINK REL="stylesheet" HREF="http://www.situskamu.com/global.css" TYPE="text/css"> </HEA
Read more