Trang chủ » Bài viết » Thủ thuật web

Tạo icon từ bộ Font Awesome bằng CSS
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:
Copy
 
.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;
}


Và chỉ cần thay đổi giá trị content các bạn có thể tạo ra được các icon như sau:











Hy vọng với bộ icon này, các bạn sẽ tha hồ mà áp dụng cho web của mình. Chúc các bạn thành công !

Từ khóa: code tao bo icon tu bo font cua may tinh, huong dan lam icon bang lenh css, tao icon cho web khong can hinh anh, cach tao bo icon ma khong can dung photoshop, ung dung icon cua Font Awesome cho web,

Bài viết coppy từ webmaster

Click xem nguồn
Danh mục: Thủ thuật web | Thêm bởi: Bờm-Cute [28-10-2017] | Thẻ: code, WebSite, css, javascript, html, Icon Lượt xem: 110

Đừng quên like nếu bài viết hữu ích nhé!
   
 
Chuyện cô gái gặp nhân tình hứ...

Chuyện cô gái gặp nhân tình hứ...

Anh nói em không có chồng thì anh sẽ bỏ vợ đến bên em, còn nếu em có chồng thì anh vẫn là người yêu em và giúp đỡ em lúc em khó khăn.
Bài trắc nghiệm giúp bạn kiểm ...

Bài trắc nghiệm giúp bạn kiểm ...

Bảng câu hỏi sau đây giúp cho bạn có thể đánh giá để biết bạn hoặc người thân của bạn có các triệu chứng trầm cảm hay không. 

Thi phẩm
0
18-08-2017

Từ xưa tới nay chủ đề mẹ chồng nàng dâu luôn là một chủ đề nhức nhối của nhiều gia đình, phải chăng những ác cảm giữa con dâu và mẹ chồng là không thể xóa bỏ. Nếu bạn là người đàn ông mẫu mực bạn sẽ nghiêng về bên nào? Đọc bài thơ này và ngẫm nhé.

Làm thế nào để con kiểm s...
0
28-09-2017

Thiếu kỹ năng kiểm soát cảm xúc sẽ dẫn đến nhiều vấn đề nghiêm trọng khi trẻ lớn lên. Dưới đây là 9 cách để bố mẹ giúp kiềm chế hiệu quả những cơn giận giữ, hung hăng của trẻ.

Auto Click Full Version V2.0, ...
0
05-07-2017

AutoClick là phần mềm giúp người dùng đơn giản hóa các thao tác với chuột máy tính, khi tải AutoClick phần mềm sẽ tự động thao tác nhấp chuột theo chỉ định mà người dùng thiết đặt.

Tạo bản sao cho Bootable Flash...
0
30-06-2017

XHTT Ngày nay, Flash USB là một công cụ phổ biến thay thế cho các loại đĩa CD/DVD ngày trước. Không chỉ được dùng để lưu trữ và chia sẻ dữ liệu, Flash USB còn được sử dụng để cài đặt hệ điều hành cho máy tính.

Tạo icon từ bộ Font Awesome bằ...
0
28-10-2017

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.

Tổng bình luận: 0
avatar