Selasa, 26 Juni 2012

Belajar membuat halaman web sederhana dengan notepad bag 4

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>

<th>Nama kendaraan</th><th>Kapasitas muatan</th><th>Jumlah kendaraan</th>

<th>Total </th>

</tr>

<td>mini bus</td><td>10 orang</td><td>3</td><td>30 orang</td>

</tr>

<td>bus kota</td><td>30 orang</td><td>5</td><td>150 orang</td>

</tr>

<td>bus way</td><td>60 orang</td><td>4</td><td>240 orang</td>

</tr>

<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)

artikel diatas boleh di copas tapi baca dulu di sini

wajib online

Selasa, 26 Juni 2012

Belajar membuat halaman web sederhana dengan notepad bag 4

artikel diatas boleh di copas tapi baca dulu di sini

Artikel Terkait:

8 komentar: