widget popular post keren, Cara Membuat Widget Popular Post Multi Color, Popular Post Berwarna warni, cara membuat popular post warna warni, Membuat Popular Post Keren dan Berwarna
Cara Membuat Widget Popular Posts Multi Color - Kali ini kita akan belajar bagaimana cara menghias Pupular Post agar lebih menarik, popular post berwarna warni yang akan kita pelajari kali ini degan menggunakan CSS3 :nth-child() Selector.
Langsung pada tutorial, untuk Demo silahkan lihat pada bagian akhir artikel ini, silahkan Pelajari dan Edit Sesuka Hati
Contoh CSS Popular Posts Multi Color
Secara default widget Populer Post Blogger mempunyai nama class
.PopularPosts{...}
. Contoh css dibawah ini hanya untuk bagian background-color
nya saja, silahkan diedit lagi agar sesuai selera.
.PopularPosts ul li:nth-child(1) {
background-color: #bfe857;
}
.PopularPosts ul li:nth-child(2) {
background-color: #40ff00;
}
.PopularPosts ul li:nth-child(3) {
background-color: #fdcb01;
}
.PopularPosts ul li:nth-child(4) {
background-color: #dedb00;
}
.PopularPosts ul li:nth-child(5) {
background-color: #9fd4e8;
}
.PopularPosts ul li:nth-child(6) {
background-color: #01ace2;
}
.PopularPosts ul li:nth-child(7) {
background-color: #bf00ff;
}
.PopularPosts ul li:nth-child(8) {
background-color: #01ace2;
}
.PopularPosts ul li:nth-child(9) {
background-color: #ff0098;
}
.PopularPosts ul li:nth-child(10) {
background-color: #eb3ee0;
}