BAB V LAYOUT HALAMAN DENGAN HTML

5.1 Membuat table

Cara membuat tabel:

1. Menu Insert , Tabel.
2. Dialog pembuatan tabel:

- Rows, menentukan jumlah baris tabel.
- Columns, menentuka jumlah kolom tabel.
- Width, menentukan ukuran lebar tabel (pixel,persen)
- Border, ketebalan border atau batas tabel.
- Cell Padding, jarak antar isi sel dgn batas tepi sel
- Cell Spacing, menentukan jarak antar sel dlm tabel.
- Header , memberi keterangan teks .


5.2 8.1 Membuat table
Urutan prioritas format pada tabel :
1. Sel
2. Baris
3. Tabel
Bila kita merubah bgcolor pada sel dengan warna merah kemudian merubah bgcolor di tabel maka sel tadi tetap tetap merah.


5.3 Mengatur properti table
Menampilkan properties:
Cara 1 : Windows – Properties
Cara 2 :Ctrl + F3
Menyeleksi atau memilih tabel agar tampil di properti:
Cara 1 : Klik sudut kiri atas tabel
Cara 2 : Pilih tabel, menu Modify, Tabel, Select Tabel
Cara 3 : Gunakan tag <table> pada tag selector.

5.4 Mengatur properti table
Keterangan properties table :
Table Name, memberi nama tabel.
Number of Rows, menentukan jumlah baris dalam tabel.
Number of Columns, menentukan jml kolom di tabel.
Width, menentukan lebar tabel dengan satuan persen / pixel.
Heght, menentuka tinggi tabel .(persen/pixel)
CellSpace, menatur jarak antar sel tabel
CellPad, mengatur jarak antara isi sel dengan batas tepi sel
Alignment, mengatur perataan tabel dala jendela dokumen.


5.5 Mengatur properti table
Keterangan properties table :

Border Width, menentukan ketebalan garis bingkai. Clear Column Width, menghapus lebar kolom tabel. Convert Tabel to Pixels, merubah satuan lebar persen ke pixel. Convert Tabel to Percent, mrubah satuan lebar pixel ke persen. Clear Row Height, menghapus nilai tinggi baris tabel. Class, mengatus class CSS yg akan digunakan. 

5.6 Memilih elemen table
Memilih Satu Sel, letakan atau aktifkan pointer pada salah satu sel. Memilih beberapa sel,
Cara 1 : Klik pada sel , geser mouse ke sel lain .
Cara 2 : Pilih salah satu, tekan Shift, Klik sel yg lain(berurutan).
Cara 3 : Pilih salah satu, tekan Ctrl, Klik sel yg lain(acak).
Memilih baris. Memilih satu kolom

5.7 Mengubah ukuran tabel,baris,kolom
Mengubah lebar dan tinggi tabel, seleksi tabel, geser kotak pengatur ukuran tabel.
Mengubah lebar kolom, geser garis pebatas kolom.
Mengubah lebar seluruh kolom scr bersamaan, tekan Shift dan geser garis pebatas kolom.
Pengaturan lebar / tinggi baris dengan properti, isi pada kotak input W untuk lebar dan H untuk tinggi. (pixel/persen)


5.8 Menambah dan menghapus baris,kolom
Menambah baris atau kolom tunggal :
- Klik salah satu sel.
- Modify-Table-Insert Row untuk menambah baris baru.
- Modify-Table-Insert Columns untuk menambah kolom baru.

Menambah beberapa baris / kolom sekaligus.
- Klik salah satu sel.
- Modify-Table-Insert Row or Column.
- Insert : pilih baris atau kolomyg di tambah
- Number of : Jumlah baris/kolom yg akan ditambah Where : letak satelah/sebelum, atas/bawah


5.9 Menambah dan menghapus baris,kolom
Menghapus baris atau kolom:
- Aktifkan sel yang ingin dihapus.
- Modify – Table – Delete Row, untuk menghapus baris.
- Modify – Table – Delete Column, untuk menghapus kolom.
atau
- Pilih / seleksi satu kolom / satu baris penuh, Delete.

5.10 Mengubah properti sel table
Pastikan kursor berada berada di sel. Keterangan properti:
- Merges selected cells using spans, mengabungkan dua atau lebih sel.
- Splits cell into roes or columns, memecahkan sel menjadi beberapa baris atau kolom.
- Horz/ Horizontal Alignment of the sell contents, mengatur tata letak teks (kanan, kiri, tengah).
- Vert/Vertical Alignment of the cell contens, mengatur perataan vertikal isi sel, baris, atau kolom.
- Width of cell in pixels or percent, mengatur lebar sel (pixel/%)
- Height of cell in pixels or percent, mengatur tinggi sel (pixel/%)
- No wrap, mencegah agar teks yg dimasukan tidak melipat/pindah baris.
- Header, mengubah sel yg dipilih sebagai judul tabel.
- Background Color, memberi warna latar belakang.


5.11 Membuat tabel isi
Tabel isi adalah tabel yang diletakan di dalam sebuah sel.
Ukuran tabel isi terbatas atau tidak boleh melebihi ukuran sel . Cara membuat :
- Letakan kursor di sel lokasi tabel yang akan disisipkan.
- Menu Insert, Tabel, isikan dialog tabel.

Untuk mendapatkan desain yang rapi, khusus tabel ini gunakan ukuran 100 % agar ukuran tabel isi dapat menyesuaikan dengan ukuran sel lokasinya.
Ok.


5.12 Mengurutkan data table
Bisa mengurutkan tabel berdasarkan isi dari 2 kolom.
Tidak bisa mengurutkan baris yang tabelnya berisi kolom yang digabung. Cara :
- Pilih table .
- Menu Commands – Sort Table

Keterangan dialog Sort Tabel:
- Sort by, sebagai sel kunci untuk mengurutkan isi kolom tabel
- Order, untuk menentukan sistem pengurutan (alfabet/numerik) dan pola pengurutan (Ascending/Descending)
- Then by, menentukan sel kunci pengurutan kedua.


5.13 Mengunakan expanded mode

Adalah fasilitas sementara yg digunakan untuk menambahkan nilai CellPad dan CellSpace semua tabel di dalam dokumen, termasuk enambah border agar tabel mudah di edit. Kita akan dimudahkan dalam memilih item di dalam tabel dan menempatkan kursor dengan tepat.

Caranya :
- Posisikan di jendela Design
- Menu View – Table Mode – Expanded Table

Untuk keluar :
- Klik exit di bagian atas jendela atau
- Menu View – Table Mode – Standar Mode.

KEMBALI BAB IV ===>>> KLIK DISINI <<<===

NEXT PAGE ====>>> KLIK DISINI <<<====