Membuat Table Stripped dengan nth-child

09/12/2016    Maykhel David    2923    Website

Hallo teman-teman pada kesempatan kali ini saya akan berbagi tentang trik dalam css. Trik ini membahas tentang bagaimana cara membuat table stripped dengan HTML dan CSS3. Fungsi tabel stripped ini adalah membuat pengguna menjadi mudah dalam membaca table data yang ada.

Berikut adalah cara untuk membuatnya.

Buat sebuah table biasa seperti berikut

Lalu sekarang kita buat style css untuk memberikan efek stripped pada table tersebut

Pada css diatas saya menggunakan nth-child(even) dan nth-child(odd) untuk memberikan efek belang pada baris table nya.

jika dilihat di browser akan menjadi seperti ini

Baiklah teman-teman demikian artikel tentang bagaimana cara membuat table stripped dengan css. Semoga dapat bermanfaat ya. terima kasih

No data.