CSS untuk tabel agar lebih menarik

Tampilan tabel yang dibangun dengan html bisa diperindah dengan menggunakan css. Kode-kode di bawah ini adalah kode css untuk menampilkan tabel agar lebih menarik dan serasi dengan template yang saya gunakan.

table {
  border-collapse: collapse;
  width: 100%;
}
td, th {
  border: 1px solid #ddd;
  padding: 8px;
}
tr:nth-child(even){background-color: #f2f2f2;}
tr:hover {background-color: #ddd;}
th {
  padding-top: 12px;
  padding-bottom: 12px;
  background-color: #0073aa;
  color: white;
}

Contoh tampilan tabel yang terbentuk dari css tersebut adalah seperi berikut

No
Bulan
Jumlah Hari
1
Januari
31
2
Februari
28
3
Maret
31
4
April
30
5
Mei
31
6
Juni
30
7
Juli
31
8
Agustus
31
9
September
30
10
Oktober
31
11
November
30
12
Desember
31

Komentar

Postingan populer dari blog ini