font-awesome 튜토리얼
font-awesome 시작하기

비고

설정

FontAwesome을 웹 사이트에 통합하기 위해 다양한 접근법을 사용할 수 있습니다.

일반 HTML / CSS의 경우 :

• 여기 에서 다운로드 할 수있는 압축 파일을 다운로드하고 압축을 풀어 내용을 웹 사이트에 복사하십시오. 그런 다음 웹 페이지 head 에서 /css/font-awesome.css 를 다음과 같이 참조하십시오.
  
  <link rel="stylesheet" src="/assets/font-awesome/css/font-awesome.css">
• CDN 주소를 사용하여 웹 페이지 head 에서 참조하십시오. 이러한 주소 중 하나는 https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css 입니다. 이를 참조하려면 link 태그를 사용하고 대신 소스를 CDN 주소로 설정하십시오.

패키지 관리자 :

대부분의 패키지 관리자는 Font Awesome을 패키지로 지원하며 아래에 몇 가지 예가 있습니다.

• NuGet : Font-Awesome 검색하여 설치하거나 패키지 콘솔에서 아래 명령을 실행하면됩니다. Install-Package FontAwesome
• Ruby : 다음 명령을 실행하면됩니다 : gem install font-awesome-rails
• npm :이 명령을 실행하면됩니다 : npm install font-awesome

기본 예 : 아이콘 사용

간단한 사용법은 일반적인 크기의 단일 아이콘을 참조하는 것입니다. <i class="fa fa-camera-retro"></i> (결과를 이 피들에서 봅니다.)

빈 태그를 생성 (이 사용하는 것이 좋습니다 <i> 와 클래스 "지정이 사용) fa "원하는 아이콘에 해당하는 클래스 (아이콘의 목록을 보려면 여기 ).

글꼴 굉장 사용

Font Awesome은 극히 단순하지만 강력한 라이브러리로 634 개의 아이콘을 몇 마디만으로 사용할 수 있습니다.

어떻게 작동합니까? Font Awesome은 ../fonts 디렉토리에 저장된 유니 코드 문자를 사용하여 아이콘을 텍스트로 표시 할 때 i.fa 요소를 해당 유니 코드 문자로 변경합니다.

아이콘은 어떻게 만듭니 까? 모든 아이콘 클래스는 주로 모범 사례를 위해 i 요소 또는 italic element 여야하지만 Font Awesome으로 성능을 향상시킵니다. 모든 아이콘에는 클래스 fa 가 있습니다. 이것은 아이콘을 나타내며 아이콘 이 없으면 작동하지 않습니다 . 그 후, 또 다른 접두사 원하는 아이콘을 추가, fa- . 완성 된 예제는 다음과 같습니다.

<i class="fa fa-pencil"></i>

글꼴이 멋지기 때문에 유니 코드 문자가 작동하지 않으므로 font-size , color 등과 같은 텍스트 조작도 적용 할 수 있습니다.