Cara Buat Numbered List Keren Blogger

1. Masuk Ke Blogger Agan Terlebih dahulu.

2. Masuk Ke ➦ Tema ➦ Edit HTML.

3. Copy Kode di bawah ini di atas kode ]]></b:skin>

/* NUMBERED LIST */
ol {counter-reset:li;list-style: none;font:15px 'Roboto Condensed', 'Oswald';
padding:0;margin-bottom:4em;text-shadow: 0 1px 0 rgba(255,255,255,.5);}
ol ol {margin: 0 0 0 2em;}
.post ol li{position:relative;display:block;padding:.4em .4em .4em .8em;
margin:.5em 0 .5em -0.1em;background:#F5F5F5;color:#666;text-decoration:none;
transition:all .3s ease-out;}
.post ol li:hover{background:#f4fc19;}
.post ol li:before{content:counter(li);counter-increment:li;position:absolute;
left:-2.5em;top:60%;margin-top:-1em;background:#548DD4;color:#FEFEFE;height:1.7em;width:2em;
line-height:1.7em;text-align:center;font-weight:bold;}
.post ol li:after{position:absolute; content:'';border: .5em solid transparent;
left:-1em;top:50%;margin-top:-.5em;transition:all .3s ease-out;}
.post ol li:hover:after{left:-.5em;border-left-color:#FA8072;}
.post ol li span{position:relative;display:#####;padding:0px 0px;margin-bottom:10px;background:######;color:#666;text-decoration:none;transition:all .3s ease-out;}
.post ol li span:hover{background:#;}
/* NUMBERED LIST END */

4. Selesai Sudah.. Silakan di Nikmati Numered List Kerennya ...