this → Artikel Baru – ( Atrikel Lama ↓ )

Cara Membuat Tabel pada HTML

Tabel merupakan sebuah format untuk menyusun untaian-untaian data ke dalam formasi baris dan kolom sehingga data-data yang telah tersusun tersebut dapat memiliki makna yang disebut dengan informasi. Pada html, jika seorang perancang ingin menciptakan tabel, misalnya, sebuah tabel yang terdiri atas 3 buah kolom dan 4 buah baris. Maka, proses pembuatannya dapat menggunakan tag table. Dengan menggunakan tag tersebut dapat diciptakan sebuah tabel dengan jumlah baris dan kolom yang dapat diatur sesuai dengan kemauan dari perancang situs atau website. Tidak hanya itu, beberapa atribut yang menyertai elemen tabel tersebut juga bisa digunakan untuk menggabungkan sel-sel yang terdapat dalam sebuah tabel, baik itu penggabungan baris tabel ataupun juga penggabungan baris kolom. Dari penjelasan tersebut, maka pada materi ini peserta didik akan belajar bagaimana cara untuk membuat tabel sederhana pada halaman website dengan menggunakan kode html. Sebelum memulai kegiatan, peserta didik mempersiapkan alat-alat praktiknya terlebih dahulu mulai dari PC ataupun perangkat mobile yang didalamnya terdapat aplikasi Notepad atau teks editor yang dapat digunakan untuk membuat file html. Setelah persiapan selesai, peserta didik dapat memulai kegiatan praktik dengan mengikuti instruksi berikut ini:

satu, Jalankan Notepad.
dua, Ketik baris kode program berikut ini.

<html>

 

<head>

<title>

Membuat tabel

</title>

</head>

 

<body>

<table border="1" align="center">

 

<!-- bagian heading -->

<tr>

<th bgcolor="gray"> No </th>

<th bgcolor="gray"> Nama </th>

<th bgcolor="gray"> Nilai </th>

</tr>

 

<!-- tabel baris ke-1 -->

<tr>

<td align="right"> 1 </td>

<td> Monkey D. Luffy </td>

<td align="center"> 80 </td>

</tr>

 

<!-- tabel baris ke-2 -->

<tr>

<td align="right"> 2 </td>

<td> Via Vallen </td>

<td align="center"> 85 </td>

</tr>

 

<!-- tabel baris ke-3 -->

<tr>

<td align="right"> 3 </td>

<td> Joko widodo </td>

<td align="center"> 25 </td>

</tr>

 

</table>

</body>

 

</html>


tiga, Simpan dengan nama "latihan32.html".
empat, Jalankan file latihan32.html pada browser.

Komentar

  1. Balasan
    1. Modul HTML Bimbingan Teknologi Informasi dan Komunikasi Kelas X SMAN 8 Semarang Edisi 1. 2020. Jawa Tengah.

      Hapus
  2. Tag TABLE mendefinisikan tabel pada laman HTML. Setiap baris pada tabel didefinisikan dengan tag TR. Setiap data atau sel tabel didefinisikan dengan tag TD. Secara default, teks dalam elemen TH akan dicetak tebal dan berada pada posisi tengah. Serta, secara default teks yang berada dalam elemen TD akan otomatis tersusun secara beraturan dan berada pada posisi rata kiri.

    BalasHapus
  3. Bagaimana cara yang paling tepat untuk menggunakan tabel pada html?

    BalasHapus
    Balasan
    1. Tag tabel sebaiknya digunakan untuk penyusunan data yang bentuknya tabulasi. Namun, kebanyakan perancang web pemula menggunakan tabel untuk melakukan penaataan web. Contoh, seorang perancang membuat sebuah tabel dimana pada bris bertama tabel diisi dengan header, baris kedua diisi dengan kolom konten, dan baris terakhir diisi dengan header. Tindakan ini bukanlah suatu hal yang salah, namun penggunaannya kurang tepat, karena tabel sifatnya kurang dinamis ketimbang menggunakan CSS.

      Hapus
  4. Hindari penggunaan tabel pada pembuatan laman html karena dapat membuat laman web yang dibuat tersebut kurang SEO friendly.

    BalasHapus

Posting Komentar

Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung. :D

Catatan: setiap iklan yang ditayangkan pada blog ini bersumber dari google adsense. Dengan jenis iklan yang dipilih adalah, sebagai berikut.

POIN 1, Iklan yang ditampilkan hanya boleh berbahasa indonesia atau berbahasa inggris. Tidak menerima jenis iklan dalam bahasa yang lain selain yang telah disebutkan karena blog ini dibuat untuk para pengunjung dari negara atau orang yang berbahasa Indonesia.

POIN 2, Setiap gambar yang ditampilkan pada iklan sifatnya tidak mengganggu para pengunjung yang melihat blog, atau tidak boleh menampilkan gambar yang bersifat menjijikkan atau merangsang rasa mual.

POIN 3, Jenis iklan yang dipasang bukan merupakan iklan spam, atau berisi dan mengarahkan pengunjung ke alamat yang berbahaya atau bersifat penipuan.

POIN 4, Segala bentuk iklan tunduk dan patuh pada ketentuan dari pihak Adsense google dan pemilik blog.

POIN 5, Segala jenis iklan yang tidak bertentangan dengan poin 1-4 yang dijelaskan sebelumnya, maka iklan tersebut dapat ditampilkan pada blog.



~ Ikatlah Ilmu dengan Memostingkannya ~

Hot Artikel

Enkapsulasi pada Java

Perbedaan stdio.h dan stdlib.h pada Bahasa C

10 Aturan Utama Penggunaan Overriding pada Java

5 Cara Konversi Tipe Data pada Java

6 Aturan Penting Switch Statement pada Java

Perbedaan Antara int main() dan int main(void) pada Bahasa C

Penjelasan Singkat tentang Konsep Asosiasi, Komposisi, dan Agregasi pada Java