Tạo icon bằng css cho blogspot ~ Ngoc Anh

Font Awesome là thư viện cung cấp cho bạn hàng ngàn icon có thể dễ dàng tùy chỉnh mọi thứ bằng css như kích cỡ, màu, bóng đổ, v.v.. Mặc dù ...

CSS

Font Awesome là thư viện cung cấp cho bạn hàng ngàn icon có thể dễ dàng tùy chỉnh mọi thứ bằng css như kích cỡ, màu, bóng đổ, v.v.. Mặc dù có nhiều ưu điểm cực kì hấp dẫn (icon nhìn tốt ở mọi kích cỡ, tốc độ tải cực lẹ,..)

Tạo icon bằng css cho blogspot

Nhưng bạn có thể sử dụng nó một cách hoàn toàn miễn phí. Bài viết này mình xin giới thiệu đến các bạn cách sử dụng Font Awesome trên nền tảng miễn phí Blogger.

Cài đặt icon Font Awesome

Font Awesome là một web font chứa tất cả các icon từ Twitter Bootstrap framework , bằng cách ấn định giá trị content trong css, các bạn có thể tạo ra các icon theo ý muốn. Giả sử các bạn muốn tạo icon từ phần tử nào, thì chỉ việc khai báo như sau :

.element {

position: relative;

}
/*replace the content value with the

corresponding value from the list below*/

.element:before {

content: "\f000";

font-family: FontAwesome;

font-style: normal;

font-weight: normal;

text-decoration: inherit;

/*--adjust as necessary--*/

color: #000;

font-size: 18px;

padding-right: 0.5em;

position: absolute;

top: 10px;

left: 0;

}

Các bạn chỉ cần thay đổi giá trị content các bạn có thể tạo ra được các icon: Tải bộ icon đầy đủ bên dưới nhé.

Download
Click here

Lơi ích khi sử dụng Font Awesome?

Lợi ích của việc thay thế này rất rõ ràng, khi sử dụng Font Awesome bạn sẽ thấy:
– Không cần mất công sức để thiết kế các icon nữa
– Giảm 1 phần đáng kể dung lượng của website
– Thay đổi rất thuật lợi, phóng to thu nhỏ và thay đổi màu sắc tùy ýCác bạn chỉ cần thay đổi giá trị content các bạn có thể tạo ra được các icon
Chúc các bạn thành công .