Membuat Tabel Mengatur Ukuran Tabel

Bab V Menggunakan Perangkat Lunak untuk Membuat Website 160 7 Setelah memasukkan teks, sel diatur sehingga lebar dan tinggi sel berturut-turut 806 dan 54 piksel. Agar teks ”Situs Buatanku” terletak di tengah-tengah sel, seleksi teks kemudian klik ikon Align Center. f. Memasukkan Gambar dalam Sel Selain teks, Anda dapat pula memasukkan gambar ke dalam sel. Gambar dapat dimasukkan sebagai gambar latar belakang back- ground maupun sebagai pengisi sel. Sebagai contoh, perhatikan bagian halaman index berikut. Cara memasukkan gambar sebagai pengisi sel dapat Anda simak pada uraian berikut. 1 Aktifkan kursor pada sel yang akan diberi gambar. 2 Untuk mengambil gambar, lakukan klik ikon Images. Sumber: Macromedia Dreamweaver 8 Gambar 5.67 Klik ikon Images Sel yang akan diberi gambar Sumber: Macromedia Dreamweaver 8 Gambar 5.66 Bagian halaman yang akan diisi gambar Sumber: Macromedia Dreamweaver 8 Gambar 5.64 Mengatur ukuran sel Sumber: Macromedia Dreamweaver 8 Gambar 5.65 Memilih Align Center Teknologi Informasi dan Komunikasi Kelas XI SMAMA 161 3 Ambil file gambar yang sesuai. Dalam contoh ini digunakan file 2.jpg berukuran 567 x 453 piksel. Klik OK untuk melanjutkan proses. 4 Klik OK pada kotak dialog Image Tag Accessibility Attributes yang muncul. 5 Selanjutnya komputer akan menampilkan gambar yang telah dimasukkan ke dalam sel. Ukuran gambar dapat diperkecil atau diperbesar. Caranya, klik dan drag salah satu titik hitam di tepi gambar. Sumber: Macromedia Dreamweaver 8 Gambar 5.69 Kotak dialog Image Tag Accessibility Attributes Sumber: Macromedia Dreamweaver 8 Gambar 5.68 Mengambil file gambar Sumber: Macromedia Dreamweaver 8 Gambar 5.70 Gambar telah masuk ke dalam sel Bab V Menggunakan Perangkat Lunak untuk Membuat Website 162 Jika Anda ingin menggunakan gambar sebagai latar belakang sel, lakukan langkah-langkah berikut. 1 Aktifkan kursor pada sel yang akan diberi gambar latar belakang. 2 Kemudian, klik ikon Background URL of Cell. 3 Sesaat kemudian komputer akan menampilkan kotak dialog Select Image Source. Pilih file yang sesuai dalam contoh ini digunakan file ikan2 berukuran 869 x 590 piksel. Klik tombol OK untuk melanjutkan proses. 4 Cara yang sama dilakukan untuk memberikan gambar background pada sel C. Agar tampilan sel bagus, ukuran sel dapat diperbesar atau diperkecil. Selain itu, pilihan pengulangan pemasangan gambar juga perlu diatur. Sumber: Macromedia Dreamweaver 8 Gambar 5.72 Memilih file gambar Sumber: Macromedia Dreamweaver 8 Gambar 5.71 Klik ikon Background URL of Cell Teknologi Informasi dan Komunikasi Kelas XI SMAMA 163 Pembuatan halaman index hampir selesai. Proses selanjutnya yaitu mewarnai dan memberi teks pada dua sel terbawah. Misalkan sel kiri bawah disebut sel C, sedangkan sel kanan bawah disebut sel D. Sel C diwarnai menggunakan kode warna CC66FF. Sedangkan sel D diwarnai menggunakan kode warna CC00FF. Setelah itu, sel C akan diisi dengan teks Sains, sedangkan pada sel D akan diisikan teks Seni. Teks Sains dan Seni akan diubah menjadi link untuk mengunjungi halaman_sains halaman 2 dan halaman_seni halaman 3. Sebagai catatan, pembuatan link ini akan dijelaskan pada bagian lain dalam bab ini.

g. Pengaturan Letak Tabel terhadap Halaman

Letak tabel juga memengaruhi tampilan website yang Anda buat. Untuk mengatur letak tabel, gunakan cara berikut. 1 Aktifkan kursor pada halaman. 2 Lakukan klik pada tombol Page Properties. Perhatikan contoh pengaturan berikut. Left margin batas tepi kiri: 20 piksel, Right margin batas tepi kanan: 20 piksel, Top margin batas tepi atas: 10 piksel, serta Bottom margin batas tepi bawah: 0 piksel. Sumber: Macromedia Dreamweaver 8 Gambar 5.74 Contoh pengaturan letak tabel Sumber: Macromedia Dreamweaver 8 Gambar 5.73 Pengaturan sel C dan sel D