GADGETS FOR BLOGS

Facebook Google plus YouTube Pinterest Tumblr DIIGO Start.me feedburner

ΕΓΧΡΩΜΟ ΣΤΥΛ ΓΙΑ ΤΙΣ ΔΗΜΟΦΙΛΕΙΣ ΑΝΑΡΤΗΣΕΙΣ

POPULAR POSTS
ΕΓΧΡΩΜΟ ΣΤΥΛ ΓΙΑ ΤΙΣ ΔΗΜΟΦΙΛΕΙΣ ΑΝΑΡΤΗΣΕΙΣ
Με τον παρακάτω κώδικα μπορείτε να διαμορφώσετε τις δημοφιλείς αναρτήσεις του blogger να εμφανίζονται μέσα σε έγχρωμα κουτιά και με διαφορετικό χρώμα για την κάθε μία δημοφιλή ανάρτηση. Ο κώδικας αυτός μπαίνει μέσα στο πρότυπο πρίν την ετικέτα ]]></b:skin> Μπορείτε να αλλάξετε τα χρώματα αλλάζοντας τους κωδικούς των χρωμάτων που προηγήται το σύμβολο της δίεσης #Μπορείτε να αλλάξετε την γραμματοσειρά και το μέγεθός της αλλάζοντας το font:13px Arial; Και τέλος μπορείτε να στρογγυλέψετε τις γωνίες περισσότερο ή λιγότερο αν αυξομειώσετε το border-radius:5px;


ΔΕΙΤΕ ΠΩΣ ΘΑ ΦΑΙΝΟΝΤΑΙ ΟΙ ΔΗΜΟΦΙΛΕΙΣ ΑΝΑΡΤΗΣΕΙΣ ΣΕ ΕΝΑ DEMO BLOG ΕΔΩ.

/* --- POPULAR POSTS COLOR STYLE ----------------------*/
#PopularPosts1 ul{margin:0;padding:0;list-style-type:none}
#PopularPosts1 ul li{position:relative;margin-bottom:5px;margin-left:0px;border-radius:5px;padding:5px}
#PopularPosts1 ul li:first-child{background:#661111;width:auto;}
#PopularPosts1 ul li:first-child:after,
#PopularPosts1 ul li:first-child + li{background:#173377;width:auto;}
#PopularPosts1 ul li:first-child + li:after,
#PopularPosts1 ul li:first-child + li + li{background:#105105;width:auto;}
#PopularPosts1 ul li:first-child + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li{background:#740777;width:auto;}
#PopularPosts1 ul li:first-child + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li{background:#532000;width:auto;}
#PopularPosts1 ul li:first-child + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li +li{background:#333333;width:auto;}
#PopularPosts1 ul li:first-child + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#115599;width:auto;}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li +li{background:#A11111;width:auto;}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#621061;width:auto;}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li +li{background:#178058;width:auto;}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li + li:after,
#PopularPosts1 ul li:first-child:after,
#PopularPosts1 ul li:first-child + li:after,
#PopularPosts1 ul li:first-child + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin:0px;background:#transparent;padding:0;width:80px;height:80px;}
#PopularPosts1 ul li a{font:13px Arial;padding-left:4px;color:#FFFFFF;text-decoration:none}
#PopularPosts1 ul li a:hover{color:#33FFFF;text-decoration:none}
#PopularPosts1 img{border-radius: 5px;padding:0px;border:none;}
#PopularPosts1 img:hover {border-radius:5px;}

Δεν υπάρχουν σχόλια:

Δημοσίευση σχολίου

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".