Glyphicons
아이콘을 이미지로 표현 대신 폰트로 보여주어 고화질에서도 깔끔케 보이도록 하는 방법이다.
Bootstrap 을 통해 사용하는 방법을 보자.
사용법
성능상의 이유로, 모든 아이콘은 기본클래스와 개개의 클래스를 필요로 합니다. 사용하려면, 다음의 코드를 어디든지 붙혀놓으면 됩니다. 적절한 패딩을 위해 아이콘과 글자 사이에 공간을 남겨두세요.
< span class = "glyphicon glyphicon-search" ></ span > |
예제
툴바와 네비게이션을 위해 버튼과 버튼 그룹에 그들을 사용하거나, 폼 입력요소 앞에 덧붙힙니다.
< button type = "button" class = "btn btn-default btn-lg" > < span class = "glyphicon glyphicon-star" ></ span > Star </ button > |
Font Awesome
http://fortawesome.github.io/Font-Awesome/icons/
많은 아이콘을 제공한다 4.3.0 버전 519개
- FA의 다양한 아이콘을 Glyphicons 으로 사용 할 수 있다.
Instrumente 크롬 익스텐션을 사용하면 FA 아이콘과 class를 확인 할수 있는 항목이 있다.
첨부된 파일을 받으면 확인해 볼 수 있습니다.
bootstrap + fontawesome
'HTML' 카테고리의 다른 글
ie9 이하에서의 placeholder 사용. (0) | 2015.03.18 |
---|---|
jQuery Waypoints 스크롤 이벤트 (0) | 2015.03.18 |
widget 컴포넌트 gridster (0) | 2015.03.18 |
carousel(캐러셀) UI (0) | 2015.03.17 |
form안에 input과 button이 같이 있을때 input enter시에 button의 이벤트가 발생하는 문제 (0) | 2013.09.05 |