Membuat tabel dengan dreamweaver

Membuat tabel dengan dreamweaverDreamweaver menyediakan fasilitas yang sangat mudah dalam membantu para web desainer untuk menerapkan kreatifitasnya dalam hal desain visual halaman web termasuk penyusunan tabel dalam berbagai bentuk. Bagi anda yang baru mulai belajar dengan dreamweaver mungkin perlu baca tutorial berikut. Saya akan berbagi tentang bagaimana membuat tabel dengan dreamweaver.

Pada tutorial kali ini saya akan membantu anda membuat beberapa bentuk tabel sederhana untuk keperluan data pegawai.

Langkah pertama 

SIlahkan jalankan dreamweaver, anda bisa gunakan dreamweaver versi apa saja boleh Dreamweaver versi 8, CS1, CS2, CS3, CS4, CS5, atau CS6 (Secara umum fasilitas dasarnya sama)

Pilih jenis file dreamweaver

Biasanya akan muncul tampilan pilihan file seperti berikut, untuk contoh ini kita pilih yang basic yaitu HTML.

Setelah itu anda akan masuk ke halaman utama desain web dengan dreamweaver.

Langkah kedua

Kita akan mulai mendesain tampilan tabelnya, sebelumnya anda bisa tambahkan judul tabel terlebih dahulu dengan format heading 1.

tabel dengan dreamweaver

Kemudian, kita mulai memasukkan tabel. Ada 3 cara memasukkan tabel dalam dreamweaver, bisa menggunakan menu insert - tabel, bisa juga dengan menekan tombol keyboard CTRL+ALT+T, atau klik ikon pada tab insert - common.

 tabel dengan dreamweaver

 Maka akan muncul tampilan seperti pada gambar diatas. Ada beberapa bagian yang harus kita isi, yaitu :

  1. Rows : diisikan dengan nilai jumlah baris yang kita perlukan, misal 5 baris
  2. Columns : diisikan dengan nilai jumlah kolom, misal 4 kolom
  3. Tabel Width : diisikan dengan nilai lebar tabel. Lebar bisa kita tentukan dalam pixel layar yang artinya fix tidak berubah dalam pengecilan ukuran browser berapapun. Kita bisa juga membuat dengan percent yang artinya bisa berubah-ubah tergantung lebar layar pada browser yang kita gunakan. Misal kita buat pakai pixel saja.
  4. Border Thickness : diisikan nilai ketebalan garis, bisa 0 (tidak menggunakan garis) atau 1 (garis standard)
  5. Cell padding : diisikan nilai jarak antara garis cell dengan objek didalamnya
  6. Cell spacing : diisikan nilai jarak antara tiap cell
  7. Header : ini pilihan letak header (judul baris atau kolom). Jika kita pilih yang pertama, maka tabel tidak langsung mengatur letak header, pilihan left maka judul disediakan pada kolom kiri dst.
  8. Caption : ini untuk judul tabel (boleh tidak diisi)
  9. Align caption : posisi judul (boleh tidak diisi)
  10. Summary : keterangan tabel (boleh tidak diisi)

Lalu tekan oke. Maka akan muncul hasil sebuah tebel seperti berikut :

tabel dengan dreamweaver

Langkah ketiga

Sekarang kita mulai, mengisikan judul tabelnya misal seperti gambar berikut :

tabel dengan dreamweaver

Sekarang anda bisa isikan data pegawainya, jika perlu penambahan baris anda bisa menekan tombol TAB pada bagian baris dan kolom terakhir. Atau jika ingin menambah baris atau kolom dengan jumlah tertentu anda bisa klik kanan pada baris atau kolom yang ingin ditambahkan, lihat gambar :

tabel dengan dreamweaver

Anda juga bisa menghapus kolom atau baris pada menu tersebut.

Selamat mencoba, dan semoga bermanfaat.

Zainal Hakim

** Bebas disunting dengan menyebutkan sumber **

Artikel Lainnya

  • Cara mengganti jenis huruf di blog atau website dengan font unik dengan cufon font
    Dengan kemajuan teknologi web yang sangat pesat, sekarang jenis tulisan atau font untuk web atau blog sudah bisa diganti sesuai keinginan. Kalau sebelumnya jenis tulisan yang ada di blog atau web kita hanya sebatas font atau jenis tulisan standar yang ada diinternet saja, kini sudah bisa lebih variasi sesuai selera pemilik blog atau webnya.
  • Kombinasi warna dalam desain website
    Kombinasi warna pada desain website adalah salah satu komponen yang sangat penting. Seorang desainer yang sudah memiliki "jam terbang" cukup tinggi sangat mengetahui pentingnya kombinasi warna dan hati-hati dalam memilih warna. Akan tetapi, hal ini tentu sangat berbeda bagi mereka yang baru terjun dalam masalah desain. Warna apa yang cocok untuk website tertentu, bagaimana membuat kombinasi dari beberapa warna agar sesuai dengan tema yang dibuat, adalah sebagian dari banyak masalah warna.
  • Template website gratis
    Template website gratis. Sekarang anda tidak perlu merepotkan diri untuk menyusun template website atau blog, karena sudah banyak template yang bisa anda dapat dengan gratis alias free. Kecuali anda memang ingin template web yang fresh, original, dan sesuai dengan web atau blog yang anda buat.
  • Mengatur warna tabel dengan dreamweaver
    Sebelumnya saya sudah membahas tentang bagaimana membuat tabel dengan dreamweaver, berikut ini lanjutanya tentang bagaimana mengatur warna tabel dengan dreamweaver. Saya akan bahas tentang cara memberi warna pada tabel utama, mengganti warna baris atau kolom, mengganti posisi serta pengaturan lainnya yang berhubungan dengan tabel menggunakan fasilitas yang sudah disediakan.
  • Kriteria Desain web atau blog yang baik
    Sebuah website dapat dinilai memiliki desain yang baik apabila memenuhi kriteria penilaian tertentu yang mungkin saja berbeda tergantung dari sudut pandang penilai. Meskipun demikian, secara umum terdapat lima kriteria desain website/blog yang baik yang bisa digunakan sebagai acuan bagi Anda untuk membuat desain website/blog Anda sendiri atau hanya sekedar memperbaiki desain website/blog yang sedang Anda gunakan.

Kiriman terbaru