Thêm Flat tag Colorful cực đẹp cho blogspot

Tag mặc định trong blogspot khá đơn điệu nên bài viết này mình muốn chia sẻ các bạn một số đoạn css để tinh chỉnh tag cloud dạng flat khá thân thiện và đẹp mắt.

Thêm tag cloud flat màu sắc cho blogspot


Đầu tiên các bạn vào bố cục (Layout) > Chọn “Labels” Widget và chọn như hình bên dưới
Thêm Flat tag Colorful cực đẹp cho blogspot
Tiếp đó thêm đoạn mã css sau vào sau: ]]></b:skin>

/* Flat Labels Cloud By thuthuatvip.com —————- */ 
.sidebar .label-size { position:relative; text-transform: uppercase; text-decoration:none; font-size:13px; font-family:Open Sans; color:#fff!important; } .sidebar .label-size a { color:#fff!important; font-weight:bold; padding:8px 10px; margin:0 6px 6px 0; float:left; display:block; -moz-transition: all 0.4s ; -o-transition: all 0.4s; -webkit-transition: all 0.4s ; -ms-transition: all 0.4s ; transition: all 0.4s ; } .sidebar .label-size-1 a {background:#1abc9c;border-bottom:3px solid #127F69;} .sidebar .label-size-1 a:hover {background:#16a085;} .sidebar .label-size-2 a {background:#3498db;border-bottom:3px solid #226693;} .sidebar .label-size-2 a:hover {background:#2980b9;} .sidebar .label-size-3 a {background:#2ecc71;border-bottom:3px solid #1F8C4C;} .sidebar .label-size-3 a:hover {background:#27ae60} .sidebar .label-size-4 a {background:#9b59b6;border-bottom:3px solid #74398E;} .sidebar .label-size-4 a:hover {background:#8e44ad} .sidebar .label-size-5 a {background:#e74c3c;border-bottom:3px solid #922C20;} .sidebar .label-size-5 a:hover {background:#c0392b}
Sau khi thêm áp dụng cho blog bạn sẻ nhìn thấy style nó như thế này
Thêm Flat tag Colorful cực đẹp cho blogspot
Hy vọng bạn sẻ thích style này!
Donate MoMo: 034.34.38.599
Bài đăng mới hơn Bài đăng mới hơn Bài đăng cũ hơn Bài đăng cũ hơn

Bài đăng khác

Nhận xét

Đăng nhận xét