Hướng dẫn thêm và sử dụng Font Awesome trên Blogger
Thay vì phải ngồi hàng giờ để thiết kế với Photoshop hay tìm kiếm vất vả những biểu tượng phù hợp với website của mình thì giờ đây Font Awesome đã có thể giúp bạn làm việc này đơn giản hơn nhiều.
Font Awesome là một thư viện cung cấp cho bạn hơn 479 icon có thể dễ dàng thay đổi kích thước, màu sắc, đổ bóng, v.v... mọi thứ đều có thể thực hiện chỉ với sức mạnh của CSS.
Font Awesome kèm theo tính đa năng và tiện dụng giúp bạn tô điểm cho website của mình mà không làm giảm tốc độ tải của trang cũng như hiển thị tốt ở mọi kích cỡ,... và trên hết những tính năng ưu việt này bạn có thể sử dụng chúng hoàn toàn miễn phí mà không phải chi trả bất cứ chi phí nào.
Demo:
Bước 2: Thêm đoạn code sau vào sau thẻ mở <head>
Bước 2: Lấy đoạn mã mà bạn được cung cấp có dạng:
Xem thêm toàn bộ các tùy biến khác tại đây, bạn chỉ cần chọn hiệu ứng cần thiết và thêm những class được cung cấp vào thẻ i thôi.
Hi vọng bài viết có ích với bạn!
Font Awesome là một thư viện cung cấp cho bạn hơn 479 icon có thể dễ dàng thay đổi kích thước, màu sắc, đổ bóng, v.v... mọi thứ đều có thể thực hiện chỉ với sức mạnh của CSS.
Font Awesome kèm theo tính đa năng và tiện dụng giúp bạn tô điểm cho website của mình mà không làm giảm tốc độ tải của trang cũng như hiển thị tốt ở mọi kích cỡ,... và trên hết những tính năng ưu việt này bạn có thể sử dụng chúng hoàn toàn miễn phí mà không phải chi trả bất cứ chi phí nào.
Demo:
1. Thêm Font Awesome và Blogspot
Bước 1: Vào Mẫu -> Chỉnh sửa HTMLBước 2: Thêm đoạn code sau vào sau thẻ mở <head>
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">2. Sử dụng Font Awesome
Bước 1: Truy cập tại đây sau đó chọn icon bạn muốnBước 2: Lấy đoạn mã mà bạn được cung cấp có dạng:
<i class="fa Mã-icon"></i>
Tùy biến Font Awesome
Bạn có thể tùy biến các icon bằng CSS, bạn thêm đoạn sau vào trước thẻ ]]></b:skin> :.Mã-icon {
font-size:...;
font-weight:...;
color:...;
border:...;
padding:...;
float:...;
}Xem thêm toàn bộ các tùy biến khác tại đây, bạn chỉ cần chọn hiệu ứng cần thiết và thêm những class được cung cấp vào thẻ i thôi.
Hi vọng bài viết có ích với bạn!
