부트 스트랩 외부의 글리프콘 사용

Question

부트 스트랩을 사용하지 않고 glyphicon을 사용하는 방법은 무엇입니까?

나는 하나의 특별한 glyphicon을 좋아한다. glyphicons-chevron-left라고합니다. 이주는 모든은 내가 무료 버전을 다운로드하고 내가 필요한 .PNG를 발견하고 같은 사용했습니다
<span class="glyphicons glyphicons-chevron-left"></span>

이 :

<input type="image" src="images/glyphicons-chevron-left.png" class = "back_btn"/> 

을하지만,이 버튼의 높이와 폭을 줄 때 이미지 품질이 떨어집니다. 더 나은 방법이 있는지 궁금 해서요?

Answer 1

이미 시도한 것 외에도 3 가지 옵션이 있습니다.

당신은 벡터의로가 크거나 작게으로 pixellate되지 않습니다 PNG,보다는 SVG 이미지를 사용할 수 있습니다

SVG.

이것의 단점은 일부 오래된 브라우저 (IE 8, 내가 믿는 이하) SVG 지원을

FontAwesome/기타 아이콘 폰트 패밀리하지 않는 것입니다

당신이 원 있도록이 크로스 브라우저 호환 ' 그 문제가있다. 그러나 한 문자 만 사용하려면 전체 글꼴로로드해야합니다. 아마도 이상적이지 않습니다. 그것은 여전히 ​​전체 부트 스트랩 CSS 라이브러리에서로드하는 것보다 낫습니다.

사용자 정의 부트 스트랩은

또는 세 번째 옵션은 부트 스트랩 웹 사이트와 customise your build로 향할 것입니다 단지 glyphicons 아이콘을 포함한다.

Answer 2

이것은 Glyphicon이 글꼴이기 때문에 크기 조정이 가능한 특수 벡터 형식의 모든 아이콘을 포함하는 하나의 파일입니다 (png 이미지의 크기를 조정하면 모양이 엉망이됩니다). Icomoon 같은 도구를 사용하여 일부만 필요한 경우 자신의 website에 글리프 아이콘을 직접 다운로드하거나 아이콘 세트를 만들 수도 있습니다 (Icomoon은 글리프 아이콘에서 아이콘을 선택하지 않을 수도 있지만 다른 아이콘 세트).