wajib online - Dalam sebuah tampilan web anda pasti mengenal yang namanya tabel. Tabel memiliki peranan penting dalam desain bentuk tampilan sebuah web, tabel juga mempermudah kita dalam mengatur tata letak suatu objek pada website. Dalam posting mengenai pembuatan web sederhana bagian 4 ini kita akan belajar membuat tabel untuk tampilan web kita. Dalam membuat tabel format yang kita gunakan adalah <table></table> . Dan dibawah ini merupakan daftar kode html yang bisa kita gunakan.Width = digunakan untuk mengatur lebar tabel (satuan yang digunakan % atau pixel)
Height = dapat digunakan untuk mengatur tinggi tabel
Border = sebagai penentu tebal bingkai
Bg color = sebagai penentu warna background tabel
Align = meletakkan text secara horizontal atau mendatar
Valign = untuk meletakkan text secara vertical
Name = digunakan sebagai penentu nama tabel
Cell padding = digunakan untuk menetukan jarak padding antar cell
Cell spacing = digunakan untuk menentukan jarak spasi antar cell
Style = digunakan untuk memasukkan CSS
Border color = digunakan untuk menentukan warna bingkai
Colspan = digunakan untuk mengurangi jumlah kolom
Rowspan = digunakan untuk mengurangi jumlah baris
Sedangkan dalam pembuatan tabel, tag gunakan gunakan adalah tag <tr></tr> untuk membuat baris dan tag <td></td> untuk membuat kolom serta ada tag <th></th> bisa digunakan untuk membuat header pada tabel.
Sedang atribut tag yang digunakan untuk tag <tr></tr>, <td></td> dan <th></th> adalah
Height
Bg color
Align
Back ground
Valign
Colspan
Rowpan
Berikut contoh cara membuat tabel
1. Buka notepad anda
2. Tulis tag dibawah ini
<html>
<head>
<title>Membuat Tabel</title>
</head>
<body>
<h2>Jumlah Penumpang kendaraan umum</h2>
<table border="1" style="border-collapse: collapse" width="100%">
<tr bgcolor="#cccccc">
<th>Nama kendaraan</th><th>Kapasitas muatan</th><th>Jumlah kendaraan</th>
<th>Total </th>
</tr>
<tr align="center">
<td>mini bus</td><td>10 orang</td><td>3</td><td>30 orang</td>
</tr>
<tr align="center">
<td>bus kota</td><td>30 orang</td><td>5</td><td>150 orang</td>
</tr>
<tr align="center">
<td>bus way</td><td>60 orang</td><td>4</td><td>240 orang</td>
</tr>
<tr align="center">
<td colspan="3">TOTAL SEMUA>>> </td><td><b>420 orang</b></td>
</tr>
</table>
</body>
</html>
3. Simpan notepad, pada kotak save as type, pilih ‘all type’
4. Kemudian buka file tadi melalui browser internet ( mozila, internet explorer atau google chrome) “dan terlihat seperti gambar dibawah ini”
( bentuk tabel web sederhana kita)
Terima Kasih sobat udah mau membagi ilmunya .
BalasHapustidak mengerti sama sekali apa maksudx...
BalasHapus(y)
Hapusterima kasih bantuan infonya
BalasHapusmakasih infonya , gara" info ini PR ku sudah selesai :D
BalasHapuscara menentukan letak tabel dalam hlman web bagaimana kak?
BalasHapusThanks informasinya semoga bermanfaat bagi saya dan juga semoga punya informasi baru lagi yang bisa kami dapatkan
BalasHapusitu pakek notepad biasa atau notepad++,,,trimakasih ilmunya kak,,
BalasHapuskunjungi website saya : https://nurrizkiana.mahasiswa.atmaluhur.ac.id/
website kampus saya : http://www.atmaluhur.ac.id/