Jumat, 18 Maret 2016

Membuat Tabel Menggunakan HTML

Tugas BLOG-2_201512101_Fachri Eka Putra_Pagi2

Fachri Eka Putra
201512101
Pagi 2



Assalamu'alaikum Wr. Wb

Di post ini saya akan membuat tabel dengan menggunakan HTML.
Kita dapat menggunakan Notepad untuk membuat file HTML.

Pertama-tama kita akan membuat contoh tabel sederhana.
1. Buka Notepad
2. Ketikkan skrip di bawah ini :















3. Kemudian Save As file, beri nama dan ganti extensinya menjadi .html seperti gambar di bawah ini :
Save file sebagai file html

4. Buka file yang sudah di save tadi dengan menggunakan browser dan akan tampil hasil seperti ini :
Hasil tampilan di browser Google Chrome

5. Demikian cara membuat tabel sederhana.

Berikut ini adalah penjelasan dari skrip html di atas :
  • tag <html> = Untuk mengawali dan mengakhiri sebuah skrip html
  • tag <title> = Untuk menamai sebuah file html saat ditampilkan di browser
  • tag <table> = Untuk membuat tabel pada html
  • attribut border = Untuk mengatur ketebalan garis luar pada tabel
  • tag <tr> = Untuk membuat baris pada tabel (tag diletakkan di dalam tabel)
  • tag <td> = Untuk membuat kolom pada tabel (tag diletakkan di dalam tr)


Oke, selanjutnya saya akan membuat tabel yang menggunakan penggabungan kolom maupun baris

1. Buka notepad
2. Masukkan skrip berikut :



3. Kemudian save file sebagai html seperti cara sebelumnya
4. Buka file di browser jika ingin melihat hasil dari skrip di atas.

5. Demikianlah cara membuat tabel dengan menggabungkan beberapa kolom atau baris.

Berikut ini penjelasan dari skrip tabel Data Nilai Mahasiswa
  • tag <font> = Digunakan untuk merubah font (dibutuhkan attribut-attribut tambahan)
  • <font face> = Untuk mengubah jenis font
  • <font size> = Untuk mengubah ukuran font
  • tag <b> = Untuk menebalkan tulisan (Bold)
  • tag <rowspan> = Untuk menggabungkan sel dalam satu kolom (Jumlah baris dapat disesusaikan)
  • tag <colspan> = Untuk menggabungkan sel dalam satu baris (Jumlah baris dapat disesuaikan)
  • <td align> = Menentukan letak isi td/kolom
  • <td width> = Menentukan lebar td/kolom

Sekian isi dari pos ini. Terima kasih sudah membaca









Tidak ada komentar:

Posting Komentar