Seperti yang telah saya sampaikan di materi sebelumnya, materi belajar css kali ini membahas tentang belajar CSS table. Tabel yang terlihat biasa saja jika dibuat menggunakan html, akan terlihat lebih bagus dan meriah apabila menggunakan css. Tabel berguna sekali untuk memuat data agar terlihat lebih rapi. Untuk mengaplikasikan table dalam css, kita menggunakan table property. Contoh dibawah ini table menggunakan garis luar hitam, serta elemen th dan td
table, th, td
{
border: 1px solid black;
}
Okey, berikut ini property umum yang sering digunakan dalam table.
Border – Colaps , property ini digunakan untuk memformat tampilan border menjadi single atau double line.
table
{
border-collapse:collapse;
}
table,th, td
{
border: 1px solid black;
}
Border – Spacing, property ini digunakan untuk mengatur jarak spasi antara border dengan isi cell.
td
{
padding:15px;
}
Tabel text algiment , mengatur text dalam table. Untuk horizontal mengatur teks kanan, kiri atau tengah
td
{
text-align:right;
}
Sedangkan untuk texs align vertical mengatur teks keatas, bawah :
td
{
height:50px;
vertical-align:bottom;
}
Table – Color, digunakan untuk mengatur warna dar border, teks maupun background
table, td, th
{
border:1px solid green;
}
th
{
background-color:green;
color:white;
}
Nah, dengan berakhirnya materi CSS table ini maka berakhir juga materi belajar macam-macam style pada css. Sekedar untuk mereview, kita telah belajar dasar-dasar css dan juga style css. Saya yakin, anda sudah bisa bereksperimen dengan skrip-skrip css. Materi belajar css selanjutnya adalah mengatur model box atau kotak dalam css. Nantikan artikel-artikel kami selanjutnya!