부트스트랩 글꼴 아이콘을 사용하는 방법

Bootstrap에는 200개 이상의 글꼴 형식의 글리프가 번들로 제공됩니다. 먼저 글꼴 아이콘이 무엇인지 먼저 이해하겠습니다.

글꼴 아이콘이란 무엇인가요? (추천 학습: Bootstrap 비디오 튜토리얼)

폰트 아이콘은 웹 프로젝트에서 사용되는 아이콘 글꼴입니다. Glyphicons Halflings에는 상용 라이센스가 필요하지만 프로젝트 기반 부트스트랩을 통해 이러한 아이콘을 무료로 사용할 수 있습니다.

아이콘 작성자에게 감사의 마음을 전하기 위해 이용 시 GLYPHICONS 웹사이트 링크를 포함해주시길 바랍니다.

글꼴 아이콘 받기

환경 설치 장에서 Bootstrap 3.x 버전을 다운로드하고 디렉토리 구조를 이해했습니다. 글꼴 아이콘은 다음 파일이 포함된 글꼴 폴더에서 찾을 수 있습니다:

glyphicons-halflings-regular.eot

glyphicons-halflings-regular.svg

glyphicons-halflings-regular.ttf

glyphicons-halflings- Regular.woff

관련 CSS 규칙은 dist 폴더 내 css 폴더의 bootstrap.css, bootstrap-min.css 파일에 작성되어 있습니다.

200개의 클래스가 있으며 각 클래스는 아이콘을 위한 것입니다. 이러한 클래스의 일반적인 형식은 다음과 같습니다.

.glyphicon-keyword:before {
  content: "hexvalue";
 }

아이콘을 사용해야 하는 경우 다음 코드를 사용하면 됩니다. 아이콘과 텍스트 사이에 적절한 공간을 남겨주세요.

<span class="glyphicon glyphicon-search"></span>

Bootstrap과 관련된 더 많은 기술 기사를 보려면 Bootstrap Tutorial 칼럼을 방문하여 알아보세요!

위 내용은 부트스트랩 글꼴 아이콘을 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!