Font Awesome에서 웹페이지에 아이콘을 올려보세요!
1485 단어 HTML프로그래밍 초보자FontAwesomeCSS아이콘
미래 전자 기술 (htps //w w. 미라이 덴시 - ch. jp / 인테 r-콘텐 t / p 여과 등 m /)
에서 인턴을하고있는 odatti입니다.
지금은 HTML과 CSS에 대해 배우고 있습니다.
이번에는 웹 사이트의 버튼에 사용되는 아이콘
↑이런 것입니다
를 올리고 싶을 때 사용하는 Font Awesome에 대해 소개합니다.
저는 프로그래밍 초보자이므로 잘못이 있다면 점점 지적해주세요. 즉시 수정합니다.
Font Awesome이란?
Font Awesome 페이지 ( htps : ///후타타우우소메. 이 m/v4.7.0/ )
를 들여다 보면,
Font Awesome gives you scalable vector icons that can instantly be customized
그리고 있습니다.
아이콘을 그림으로서가 아니라 문자로서 이용할 수 있는 툴이군요.
문자로 사용할 수있는 장점은 customized.
즉, 크기나 색 등을 스스로 조절할 수 있다는 것입니다.
여기에서는 HTML과 CSS에서 Font Awesome 아이콘을 표시하는 방법을 설명합니다.
1. Font Awesome CSS 파일 불러오기
사용하려는 아이콘을 찾으면 CSS 파일을 로드합니다.
그런 다음 링크를 HTML 파일에 붙여 넣습니다.
2.span 태그에 fa 클래스와 fa-(아이콘명) 클래스를 지정
두 클래스를 별도로 지정합시다.
사실, 이 단계만으로 웹페이지에 아이콘을 표시할 수 있습니다.
아이콘의 종류는 600종류 이상으로 풍부하므로, 웹 페이지를 보다 세련되고 개성적으로 할 수 있다고 생각합니다.
결론
이상, Font Awesome의 개요와 사용 방법에 대해 설명했습니다.
매우 편리하므로 웹 페이지에 아이콘을 올리고 싶을 때는 꼭 사용해보십시오!
Reference
이 문제에 관하여(Font Awesome에서 웹페이지에 아이콘을 올려보세요!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/odatti/items/43c8a68802d08f655a33
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
이상, Font Awesome의 개요와 사용 방법에 대해 설명했습니다.
매우 편리하므로 웹 페이지에 아이콘을 올리고 싶을 때는 꼭 사용해보십시오!
Reference
이 문제에 관하여(Font Awesome에서 웹페이지에 아이콘을 올려보세요!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/odatti/items/43c8a68802d08f655a33텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)