Baca Juga
Halo Gan :) Ketemu lagi nih sama ane, Oke tanpa basa basi lanjut aja ke tutorialnya
Yap tutorial kali ini adalah Cara Membuat Label Cloud Flat UI memang sudah banyak tutorial seperti ini namun hanya yg berwarna hijau maupun ungu seperti gambar di bawah
Nah begitulah semuanya memiliki judul berbeda namun isi artikelnya sama, oke lanjut..
- Pertama masuk ke Blog agan dan klik Template lalu pilih Edit HTML
- Lalu Masukan Code Dibawah ini diatas </style> atau /]]></b:skin> lalu klik Simpan Template
/*CSS Label*/
.Label a{
padding-left: 5px;
padding-right: 31.5px;
color: #fff;
height: 32px;
background: #359bed;
margin-right: 2px;
line-height: 32px;
text-decoration: none;
-webkit-transition: all .3s ease-in-out !important;
float: left;
margin-top: 2px;
font-size: 13px;
text-align: left;
display: inline-block;
border: 1px solid transparent;
border-radius: 3px;
}
.Label a:hover{
background:none;
border: 1px solid #545454;
border-radius:3px;
color:#222;
}
.Label a:after{
content: "";
position: absolute;
width: 0px;
height: 0px;
border-width: 16.5px;
border-style: solid;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.3) rgba(0,0,0,0.1) transparent;
}
Kode Diatas adalah kode CSS untuk label cloud warna biru jika agan tidak suka bisa di ganti dengan kode di bawah atau agan bisa menambahkannya sendiri
Kuning #e9ed35;
Merah#ed3535;
Pink#ed35cd;
Ungu#6c35ed;
Oiya untuk demo bisa dilihat di sidebar Blog ini, dan maaf karena saat ini ane hanya membuat sedikit post karena ane masih membuat Template Blog yg akan ane bagikan untuk agan semua :*
Sekian Post Cara Membuat Label Cloud Flat UI Warna Warni Semoga Bermanfaat gan :D
Terimakasih telah meluangkan waktu dengan membaca post kami :) Salam GMFN :)
(Baca Juga:Beberapa Mitos SEO yg Banyak DiPercaya Blogger)
(Baca Juga:Beberapa Mitos SEO yg Banyak DiPercaya Blogger)