input license here

Cài đặt và sử dụng Font Awesome mới nhất cho Blog/Website

Hiện nay, việc sử dụng Font Awesome trong thiết kế web hay blogspot đều trở nên rất phổ biến. Xưa thì chúng ta thường sử dụng các icon bằng hình ảnh, việc sử dụng này buộc chúng ta phải lưu ảnh icon và nhiều thao tác rất loằn ngoằn. Nay với việc sử dụng Font Awesome chúng ta chỉ cần tích hợp 1 đường link và gọi mã để sử dụng bất kỳ một icon nào ngay trên blog/website của chúng ta.

Cài đặt và sử dụng Font Awesome mới nhất cho Blog/Website

Cài đặt

Để sử dụng được bộ Font Awesome mới nhất các bạn cần tích hợp dòng code sau vào bên trong cặp thẻ <head>...</head> của blog hoặc website của bạn:
<link rel="stylesheet" type="text/css" href="icon/css/fontawesome-all.css">

Hướng dẫn sử dụng

Đầu tiên các bạn vào trang chủ Font Awesome, sau đó chọn đến mục Icon, chọn icon mà các bạn muốn sử dụng (các icon màu đậm là những icon miễn phí, màu nhạt là các bạn phải nâng cấp tài khoản pro mới xài được. Mà thường mình xài free thôi cũng đủ lắm rồi.)

Cài đặt và sử dụng Font Awesome mới nhất cho Blog/Website

Các bạn cũng có thể nhập tìm kiếm để tìm nhanh icon mà mình cần nếu như đã quen rồi.

Tiếp đến, nhấp vào icon mà bạn muốn sử dụng nó sẽ có dạng như sau:

Cài đặt và sử dụng Font Awesome mới nhất cho Blog/Website

Bao gồm:
  • Icon Style & Prefix
  • Unicode Glyph
  • Unicode
  • HTML
  • SVG
Thì ở mỗi dạng sẽ có những cách khác nhau để sử dụng. Nhưng các bạn chỉ cần để ý đến dòng code HTML, đây là đoạn code mà chúng ta thường sử dụng và dễ chèn ở tất cả mọi nơi. Chỉ cần coppy và chèn ở nơi bạn muốn hiển thị là được.


Lời kết

Như vậy là mình hướng dẫn xong các bạn Cài đặt và sử dụng Font Awesome mới nhất cho Blog/Website. Nếu có thắc mắc gì hãy để lại bình lại mình sẽ giải đáp cho các bạn.
Related Posts
Diệp Quân
Nguyen Manh Cuong is the author and founder of the vmwareplayerfree blog. With over 14 years of experience in Online Marketing, he now runs a number of successful websites, and occasionally shares his experience & knowledge on this blog.
SHARE

Related Posts

Subscribe to get free updates

Post a Comment

Sticky