Tạo Label Cloud Flat UI Màu Xanh Tươi Mát

Bài liên quan


Xin chào, lần này mình sẽ hướng dẫn các tạo style cho các nhãn trong blogger - blogspot. Với phong cách xanh tươi mát mẽ cho ngày hè nóng nực, phối với màu sắc phẳng tạo nên sự tươi mát cho blog của bạn. Đặc biết nếu dùng màu xanh cây với trắng làm màu chủ đạo của blog thì đây thì thứ ko thế thiếu cho blog

Mục lục:

  • Mục Đích
  • Thực Hiện
  • Nâng Cao 
  • Lời Kết

Mục Đích

  • Tạo style nhãn đẹp cho blogspot
  • Tạo sự mát mẻ cho blogger
  • Tạo sự thích thú cho khách hàng
  • còn nhiều nữa...

Thực Hiện

1. Các bạn đang nhập Blogger -> Mẫu -> Chỉnh Sửa HTML
2. Sau đó các bạn Tìm với từ khóa "Label" để tìm và xóa hết các đoạn CSS có trong tenplate của bạn, nếu như ko có thì bỏ qua bước này.
3. Các bạn chép toàn bộ code CSS bân dưới vào trước thẻ đóng ]]></b:skin> hoặc thẻ đóng </style>
/*CSS Label*/
.Label a{padding-left:5px;padding-right:31.5px;color:#fff!important;height:32px;background:#1abc9c;margin-right:2px;line-height:32px;text-decoration:none;border:none!important;-webkit-transition:all .3s ease-in-out!important;float:left;margin-top:2px;font-size:13px;text-align:left}
.Label a:hover{color:#fff!important;background:#16a085}
.Label a:after{content:"";position:absolute;width:0;height:0;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}
4. Lưu Mẫu lại
5. Sau đó các bạn vào Bố Cục -> Thêm tiện ích -> Nhãn và chọn theo ảnh bên dưới.
Các bạn có thể thay đồi các thông số như sau
  • Tiêu đề
  • Hiện thị 1
  • Sắp xếp. 
  • Còn  lại giữ nguyên như hình
Demo
click to view

Nâng Cao

Khỏi cần nâng cao cái này 

Lời Kết

Vậy là mình đã hướng dẫn các bạn Tạo Label Cloud Flat UI Màu Xanh Tươi Mát, nếu có thắc mắc các bạn cứ comment bên dưới hoặc liên hệ mình, mình sẽ giải đáp. Chúc các bạn thành công

Đam mê công nghệ, lập trình web, game đua xe và nhiều thứ khác. Thích học hỏi, tìm tòi nhiều kiến thức hay bổ ích. Thích chia sẽ cho mọi người, bạn bè về những kiến thức học được.

Bài Viết Liên Quan

Previous
Next Post »

Biểu tượng mặt cười ( Copy & paste xuống phần Comment )
Hãy Luôn Comment Để Tạo Động Lực Cho Tác Giả

Emoticon

:)
:(
hihi
:-)
:D
=D
:-d
;(
;-(
@-)
:P
:o
-_-
(o)
[-(
:-?
(p)
:-s
(m)
8-)
:-t
:-b
b-(
:-#
=p~
$-)
(y)
(f)
x-)
(k)
(h)
(c)
cheer
(li)
(pl)