» » Table Element Part 7

Table Element Part 7

By Fadli_Computer Labels: at Februari 21, 2026

Assalamu’alaikum Wr. Wb

Pengantar

Hai bagaimana kabarnya? Semoga baik-baik saja ya teman-teman. Melanjutkan artikel yang sebelumnya membahas tentang Table Element menggunakan Atribut roswpan dan Colspan. Dan pada kesempatan masih melanjutkan table cuman akan membahas Tag th element pada HTML.

Tag th (table header) digunakan untuk membuat judul kolom pengganti dari tag <th>.

Harapan saya teman-teman dapat mempraktekan dan lebih baik lagi memahami materi kali ini dengan catatan di ulang pelajaran yang sudah dipraktekan agar tidak lupa. Teman-teman mulai dari sini harus membaca dengan teliti agar tidak salah memahami materinya. Semoga sukses dan berhasil, Amin.

 

Praktik HTML
Pada praktik kali kita akan membahas tag th, mari kita mulai praktiknya, struktur kode HTML
Contoh:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AlamI Computer</title>
</head>
<body>
    <h3>Belajar HTML di Alami Computer</h3>
    <p>Tag th (table header)</p>
    <table border="2">
        <tr>
            <th>JUDUL PERTAMA</th>
            <td>Baris 1, Kolom 1</td>
            <td>Baris 1, Kolom 2</td>
            <td>Baris 1, Kolom 3</td>
        </tr>
    </table>
</body>
</html>
 

Gambar 1 kode-th
 

 

Gambar 1 hasil kode-th

Sekarang coba buat menggunakan CSSnya, kode html tag <th> sebagai berikut:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <title>Belajar Di Alami Computer</title>
    <style>
        table {
            border: 2px;
            width: 50%;
            height: 50%;
        }
        tr {
            height: 200px;
        }

        th {
            padding: 4px;
            border: 2px solid blue;
        }
        td {
            padding: 3px;
            border: 2px solid rgb(9, 9, 116);
        }
    </style>
</head>
<body>
    <h3>Belajar HTML tag th (table reader)</h3>
    <table>
        <tr>
            <th>JUDUL PERTAMA</th>
            <td>Baris 1, Kolom 1</td>
            <td>Baris 1, Kolom 2</td>
            <td>Baris 1, Kolom 3</td>
        </tr>
    </table>
</body>
</html>
 

Gambar 3 kode th menggunakan css


Gambar 4 hasil kode th menggunakan css

 

Kesimpulan

Pembahasan tentang tag <th> pada table yang digunakan untuk keperluan menyajikan data secara menarik. Tujuan teman-teman yang membuat file html atau pemograman bisa menggunakan dengan baik dan sesuai dengan fungsi dan kelayakan pada sebuah kode-kode program yang akan dijalankan.

Terimakasih sudah berkunjung sampai ketemu di artikel selanjutnya, jangan lupa ikuti chanel kami yaitu :

YouTube: Alami Computer
Website: www.alamicomputer.id
Instagram: chaerullah.fadli

Daftar Pustaka: Tim Riset Alami Computer 


2 komentar:

Berkomentar dengan baik dan benar

Back to Top