Tabel merupakan fungsi yang digunakan untuk menyajikan data dalam kolom
dan baris. Lalu, bagaimana cara membuat tabel dengan HTML. Ada
unsur-unsur apa saja untuk membuat tabel dengan HTML? Di bawah ini akan
menjawab semua pertanyaan tersebut.
1. Cara Membuat Tabel dengan HTML
Untuk membuat tabel dengan HTML harus diawali dengan tag <table> dan diakhiri dengan tag </ table>.
2. Elemen yang ada di HTML
<html></html> digunakan untuk membuka dan menutup kode html.
<head></head> merupakan kepala dari html.
<title></title> digunakan unutk membuat judul halaman.
<body></body> merupakan content dari halaman.
<table></table> digunakan untuk membuka dan menutup tabel dalam kode html.
<tr></tr> digunakan untuk membentuk garis didalam sebuah tabel.
<td></td> digunakan untuk membentuk kolom tabel.
Agar lebih jelas, dibawah ini kita akan membuat sebuah contoh tabel dengan menggunakan tag html, anda boleh mengetikkan dengan menggunakan Notepad atau Notepad++ di komputer.
<html>
<head>
<title> Tabel NPM Mahasiswa Teknik Informatika 2B </title>
</head>
<body>
<body style="background-image:url(koala.jpg)">
<table border="1">
<p align="center"><font face="arial" size="30" color="blue">TABEL MAHASISWA</font></p>
<table style="border-collapse:collapse;background:#ffc" width="75%" align="center" border="1">
<tr>
<td> No </td>
<td> NPM </td>
<td> Nama </td>
<td> Jurusan </td>
</tr>
<tr>
<td> 1 </td>
<td> 1410128262047 </td>
<td> Lastri Yanti </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 2 </td>
<td> 1410128262057 </td>
<td> Monica Rachma Marantika </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 3 </td>
<td> 1410128262067 </td>
<td> Raja Khusnul Maab </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 4 </td>
<td> 1410128262080 </td>
<td> Muhamad Ramdani </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 5 </td>
<td> 1410128262048 </td>
<td> Aditya setiwan </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 6 </td>
<td> 1410128262066 </td>
<td> Sufiyandi </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 7 </td>
<td> 1410128262062 </td>
<td> Uus Kusnadi </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 8 </td>
<td> 1410128262069 </td>
<td> Bayu Setyo </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 9 </td>
<td> 1410128262075 </td>
<td> Adli Gustiansyah </td>
<td> Teknik Informatika </td>
</tr>
<tr>
<td> 10 </td>
<td> 1410128262052 </td>
<td> Cici Sofrawida </td>
<td> Teknik Informatika </td>
</table>
<body style=background-image:url(xx.jpg)">
</body>
</html>
Kemudian simpan script di atas dalam satu folder (Folder bebas dibuat terserah anda). Biasanya dalam satu folder berisi:
Sekarang bukalah broser anda, bisa menggunakan Mozilla firefox ataupun Google Chrome dan bukalah file html yang sudah anda simpan tersebut. maka hasil tampilannya akan seperti berikut ini:
Sekian artikel Cara Membuat Tabel HTML dengan Mudah. Happy Nyekrip! Terimakasih telah berkunjung. Salam optimis:)
#tugas1
0 komentar:
Posting Komentar