부트 스트랩 3 Glyphicons CDN
주의!
이 풀 리퀘스트 병합 후에 부트 스트랩 아이콘이 돌아 옵니다 .
지난 몇 주 동안 이것을 앞뒤로 진행 한 후 Glyphicons 아이콘 글꼴을 기본 저장소 로 복원 하기로 결정했습니다 . UI에서 아이콘이 얼마나 널리 퍼져 있는지를 감안할 때 CSS 및 JS와 같은 위치에 아이콘 (또는 다른 아이콘 글꼴)을 포함하지 않는 것은 대부분의 사람들에게 해가 될 것입니다.
이 업데이트에는 다음이 제공됩니다.
- 문서 복원 (구성 요소 페이지)
- 아이콘 글꼴을 유연하게 추가 및 제거하기위한 새 변수
@icon-font-path
및@icon-font-name
,- 최신 Glyphicons로 업그레이드 (새 아이콘 40 개 추가)
- CSS 페이지에서 이전 Glyphicons 언급을 제거합니다.
앞으로 아이콘 글꼴의 사용자 지정을 개선하여 글꼴 라이브러리를 더 쉽게 교체 할 수 있도록 노력할 것입니다 (원래 제거의 전체 동기였습니다).
새 버전의 Twitter Bootstrap Glyphicons의 CDN URL은 무엇입니까?
Bootstrap 3 에서 별도의 저장소로 이동 했지만 CDN을 찾지 못했습니다.
공식 문서에서 :
Bootstrap 3의 출시와 함께 아이콘이 별도의 저장소로 이동되었습니다. 이것은 기본 프로젝트를 가능한 한 간결하게 유지하고 사람들이 아이콘 라이브러리를 쉽게 교체 할 수 있도록하며 Glyphicons 아이콘 글꼴을 부트 스트랩 외부의 더 많은 사람들이보다 쉽게 사용할 수 있도록합니다.
온 공식 웹 사이트 들은 아이콘의 CDN URL을 제공하지 않습니다.
어디에서 찾을 수 있습니까? 저장소를 다운로드하여 프로젝트에 포함하고 싶지 않습니다.
최근 부트 스트랩 3 릴리스 와 글 리피 콘이 메인 부트 스트랩 저장소로 다시 병합됨에 따라 부트 스트랩 CDN 은 이제 Glyphicons를 포함한 완전한 부트 스트랩 3.0 CSS를 제공하고 있습니다. 부트 스트랩 CSS 참조는 포함해야하는 모든 것입니다. Glyphicons와 그 종속성은 CDN 사이트의 상대 경로에 있으며 bootstrap.min.css
.
HTML에서 :
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">
CSS에서 :
@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css");
다음은 작동하는 데모 입니다.
참고 사용한다는 것을 .glyphicon
대신 클래스를 .icon
:
예:
<span class="glyphicon glyphicon-heart"></span>
또한bootstrap.min.js
Bootstrap JavaScript 구성 요소를 사용 하려면 여전히 포함해야합니다 . URL 은 Bootstrap CDN 을 참조 하세요.
Glyphicons를 별도로 사용하려면 Bootstrap CDN 에서 Glyphicons css를 직접 참조하면 됩니다.
HTML에서 :
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
CSS에서 :
@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");
이후 css
파일이 이미 (부트 스트랩 CDN 사이트에서 상대 경로에있는) 모든 필요한 Glyphicons 종속성을 포함의 추가 css
파일은 Glyphicons 사용을 시작하려면 어떻게이 전부입니다.
다음은 부트 스트랩이없는 Glyphicons 의 작동 데모 입니다.
대안은 아이콘에 Font-Awesome 을 사용하는 것입니다 .
Font-Awesome 포함
CDNJS에서 Font-Awesome을 열고 최신 버전의 CSS URL을 복사합니다.
<link rel="stylesheet" href="<url>">
또는 CSS에서
@import url("<url>");
예 (버전이 변경됨) :
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
용법:
<i class="fa fa-bed"></i>
Bootstrap CDN이 glyphicon을 bootstrap.min.css로 복원했지만 Bootstrap CDN의 Bootswatch css 파일에는 glyphicon이 포함되어 있지 않습니다.
예를 들어 Amelia 테마 : http://bootswatch.com/amelia/
기본 Amelia는 다음 파일에 글 리피 콘을 가지고 있습니다 : http://bootswatch.com/amelia/bootstrap.min.css
그러나 Bootstrap CDN의 css 파일에는 glyphicon이 포함되어 있지 않습니다. http://netdna.bootstrapcdn.com/bootswatch/3.0.0/amelia/bootstrap.min.css
So as @edsioufi mentioned, you should include you should include glphicons css, if you use Bootswatch files from the bootstrap CDN. File: http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css
참고URL : https://stackoverflow.com/questions/18222849/bootstrap-3-glyphicons-cdn
'Nice programing' 카테고리의 다른 글
apt-get을 통해 Debian에 Java 7 (Oracle) 설치 (0) | 2020.10.09 |
---|---|
HTML 이메일로 base64 이미지 보내기 (0) | 2020.10.09 |
바벨을 사용한 후 IE에서 '심볼'이 정의되지 않았습니다. (0) | 2020.10.09 |
JavaFX가 Ubuntu Wily (15.10)의 OpenJDK 8에 포함되지 않은 이유는 무엇입니까? (0) | 2020.10.09 |
요소 변형 회전 애니메이션 (0) | 2020.10.08 |