Tutorial CSS Tabel

Tabel Batas

Untuk menentukan batas tabel dalam CSS, menggunakan properti perbatasan.

Contoh di bawah ini menetapkan perbatasan hitam untuk meja, th, dan elemen td:

meja, th, td
{
border: 1px hitam pekat;
}

Perhatikan bahwa tabel dalam contoh di atas memiliki batas ganda. Hal ini karena kedua meja dan tanggal / td elemen memiliki perbatasan terpisah.
Untuk menampilkan perbatasan tunggal untuk meja, menggunakan properti perbatasan-runtuh.

Tutup Perbatasan

Properti perbatasan-collapse mengatur apakah perbatasan tabel runtuh ke dalam perbatasan tunggal atau terpisah:

table
{
perbatasan-collapse: keruntuhan;
}
meja, th, td
{
border: 1px hitam pekat;
}

Tabel Lebar dan Tinggi

Lebar dan tinggi tabel didefinisikan oleh lebar dan tinggi sifat.

Contoh di bawah set lebar tabel untuk 100%, dan tinggi elemen September sampai 50px:

table
{
width:100%;
}
th
{
height:50px;
}

Tabel Teks Aligment

Teks dalam tabel sejajar dengan text-align dan vertical-align properti.
Properti text-align set alignment horisontal, seperti kiri, kanan tengah, atau:

td
{
text-align: right;
}

Properti vertical-align menetapkan alignment vertikal, seperti atas, bawah, atau tengah:

td
{
height:50px;
vertical-align:bottom;
}

Tabel Padding

Untuk mengontrol ruang antara perbatasan dan konten dalam sebuah tabel, gunakan bantalan pada td properti dan elemen th:
contoh :

td
{
padding: 15px;
}

Tabel Warna

Contoh di bawah ini menentukan warna perbatasan, dan warna teks dan latar belakang elemen th:

meja, td, th
{
border: 1px hijau;
}
th
{
background-color: green;
warna: putih;
}

 

Leave a Reply

Your email address will not be published. Required fields are marked *