티스토리 뷰

Coding/CSS

Font Awesome

jeongah story 2018. 12. 26. 12:33


Font Awesome

Font Awesome 5는 Script 또는 CSS로 연결할 수 있고, 각 방법에 대하여 CDN을 이용하거나 다운로드 받은 파일을 이용할 수 있습니다.

  • 인라인 요소와 함께 사용하도록 설계되었습니다. the ⁢i>및 ⁢span> 요소는 아이콘에 널리 사용됩니다.
  • 큰 아이콘 : fa-lg(33 % 증가), fa-2x, fa-3x, fa-4x또는 fa-5x클래스 아이콘들이 컨테이너 상대적인 크기 증가 시키는데 사용된다.
  • 목록 아이콘 : fa-ul및 fa-li클래스는 정렬되지 않은 목록에 기본 총알을 대체하는 데 사용됩니다.
  • 경계가 있고 당겨진 아이콘 : fa-border, fa-pull-right또는 fa-pull-left 클래스는 풀 따옴표 또는 문서 아이콘에 사용됩니다.
  • 애니메이션 아이콘 : fa-spin클래스는 회전하는 어떤 아이콘을 취득하고, fa-pulse 클래스는 8 단계로 회전 할 수있는 아이콘을 가져옵니다.
  • 회전 및 뒤집힌 아이콘 : The fa-rotate-*및 fa-flip-*Class는 아이콘을 회전하고 뒤집는 데 사용됩니다.
  • 누적 된 아이콘 : 여러 아이콘을 쌓으려면 fa-stack부모 클래스, 규칙에 맞는 fa-stack-1x아이콘 클래스 및 fa-stack-2x큰 아이콘을 사용하십시오. 이 fa-inverse클래스는 대체 아이콘 색상으로 사용할 수 있습니다. 상위에 더 큰 아이콘 클래스를 추가하여 크기 조정을 추가로 제어 할 수도 있습니다.
  • 고정 너비 아이콘 : 이 fa-fw클래스는 아이콘을 고정 너비로 ​​설정하는 데 사용됩니다. 이 클래스는 다른 아이콘 폭이 정렬을 벗어나는 경우에 유용합니다. 부트 스트랩의 탐색 목록 및 목록 그룹에서 특히 유용합니다.
  • 부트 스트랩 : 글꼴 굉장 또한 모든 부트 스트랩 구성 요소와 잘 작동합니다.




image 출처 : dribble

'Coding > CSS' 카테고리의 다른 글

Animation  (2) 2019.01.03
Box-Shadow  (0) 2019.01.03
CSS 단위, 색상, 선언방법  (1) 2018.12.05
이미지 타입 선택  (0) 2018.12.05
background  (0) 2018.12.05
댓글
© 2018 eh2world