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

0

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

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ệ

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

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