Bài 11: Sử dụng icon Font awesome

1 147

Trong bài này, mình sẽ hướng dẫn sử dụng icon font awesome.

Video Sử dụng icon Font awesome

Hướng dẫn chi tiết

Ưu điểm

+ Ưu điểm đầu tiên là Font Awesome có phiên bản free với tương đối đầy đủ các icon

+ Dễ dàng cài đặt

Cách dùng font awesome

+ Vào trang chủ font awesome

+ Tải về

+ Giải nén.

+ Cài đặt đường dẫn <link> trong file CSS

+ Vào lại trang chủ để tìm icon cần dùng

+ Dùng bằng thẻ bất kỳ, giới thiệu thẻ mới <i class=”theo định dạng của font awesome”><i>

+ Tăng kích thước bằng font-size

FBI Warning - dưới đây có QUẢNG CÁO

Bạn MUỐN TĂNG KÍCH THƯỚC website, nhanh, rẻ và dễ sử dụng có thể chọn hosting Azdigi nhé.
Link đăng ký: https://my.azdigi.com/aff.php?aff=1612
Nếu các bạn click và đăng ký hosting từ link trên, mình sẽ có một ít tiền để duy trì.

Các thuộc tính đã hướng dẫn

+ float: left (right) dồn các khối

+ overflow: hidden

+ display: block

+ margin và padding

+ border : viền, 1px (độ dày) black (màu) solid (loại nét)

+ text-align : canh lề

+ font-size : kích thước.

+ font-weight : bold độ đậm nhạt, giống như thẻ <b></b>

+ font-family : kiểu chữ

+ font-style: italic : tạo chữ in nghiêng

+ float : left, dồn sang một bên

+ text-decoration: none, underline.

+ line-height: 20px: độ giãn dòng.

+ color: (màu chữ) dùng green, red hay mã màu

+ background-color: (màu nền)black

+ background-image: url(imgage source).

Code mẫu: download

Nếu có thắc mắc, đặt câu hỏi bằng cách comment bên dưới, qua email, hoặc nhắn tin qua Fanpage Góc làm web.

Đừng quên LikeShare nếu thấy bài viết thú vị.

Liên hệ

  1. lac lac nói

    ad ơi e dùng font của google. và e đặt một font và một text trong một thẻ div.. ý là để cho nó cùng một dòng ấy ạ.. nhưng mà cái font và text nó k thể nằm ngang nhau đc .mong ad giúp

Để lại một trả lời

Địa chỉ email của bạn sẽ không được công bố.