Cara Menciptakan Label Cloud Terbaru

Pada kesempatan kali ini aku akan menyebarkan tutorial cara untuk menciptakan label pada blog seperi yang ada di blog arlina design.

banyak para blogger yang ingin mengikuti jejak arlina design dari segi tampilan blog hingga seluruh isinya, ini terbukti banyak blogger yang memakai template yang menyesuaikan blog arlina design.
Nah ini dia

Cara Membuat Label Cloud Seperti Blog Arlina Design

1. silahkan masuk ke blog teman masing-masing, kemudian buka HTML editor.
2. paste kan instruksi CSS dibawah ini sempurna diatas instruksi ]]><b:skin> atau </style>

/* Label */ .Label ul{padding:0}.Label li{position:relative;overflow:hidden;display:inline-block;list-style:none;margin:0 2.5px 5px 2.5px;padding:0;font-size:14px;width:48%;float:left}.Label li a,.Label ul li span{background:#ecf0f1;color:#888;padding:8px 12px;display:block;font-size:13px;border-bottom:1px solid rgba(0,0,0,0.08);transition:initial;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.Label li a:before,.Label ul li span:before{content:'';position:absolute;top:0;right:0;border-width:0 10px 10px 0;border-style:solid;border-color:#fff #fff #dee1e2 #dee1e2;background:#dee1e2;display:block;width:0}.Label ul li span:before{border-color:#fff #fff #dee1e2 #dee1e2;background:#dee1e2}.Label li a:hover:before,.Label ul li span:hover:before{border-color:#fff #fff #57606f #57606f;background:#57606f}.Label li a:hover{background:#747d8c;color:#fff}.Label ul li span{background:#f24a4a;color:#fff}

3. save template!

Info
Jika pada template anda sudah ada CSS label, silahkan ganti dengan CSS yang diatas!

nah, kini masuk ke tata letak, kemudian buat widget label, dan pilih yang list, silahkan lihat hasilnya.

Demikian Cara Membuat Label Cloud Seperti Blog Arlina Design, supaya bermanfaat.

Tags : Tips Blogger Trik Blogger

Berbagi :