문제

오늘부터 Jekyll을 사용하기 시작했는데 지금까지 마음에 듭니다.

저는 기본 테마(단순한 제목) 중 하나를 사용하고 있습니다. bootstrap-3) 파일 구조 측면에서 잘 컴파일되는 것 같습니다.

그러나 로컬 서버(또는 github.io)에서 실행할 때 일부 파일, 특히 Bootstrap에 기본으로 제공되는 glyphicon 글꼴이 누락되었습니다.

그만큼 fonts 폴더가 두 폴더 모두에 존재합니다. _site/assets 디렉토리뿐만 아니라 외부 assets 디렉토리, 그리고 내가 아는 한 그 내용은 _site 디렉토리는 서버에서 제공되는 것입니다.

그런데 Google Dev Tools를 사용하여 자산을 검색하면 글꼴을 전혀 찾을 수 없습니다.CSS는 잘 생성되지만 글꼴은 그렇지 않습니다.

흥미롭게도 다른 테마(예: the-project) 글꼴이 제대로 로드되었습니다.

내 안에 글리피콘이 존재해요 bootstrap.min.css, 내가 생각할 수 있는 유일한 것은 url() 코드가 잘못되었습니다:

src:url('../fonts/glyphicons-halflings-regular.eot') 내 안에 있어 bootstrap.css, 내 파일 구조는 상위 폴더에 다음이 포함되도록 설정되었습니다. fonts 폴더.

내 디렉토리 트리는 다음과 같습니다.

bootstrap-3
├── bootstrap
│   ├── css
│   │   ├── bootstrap.min.css
│   │   └── bootstrap.theme.min.css
│   ├── fonts
│   │   ├── glyphicons-halflings-regular.eot
│   │   ├── glyphicons-halflings-regular.svg
│   │   ├── glyphicons-halflings-regular.ttf
│   │   └── glyphicons-halflings-regular.woff
│   └── js
│       └── bootstrap.min.js
└── css
    └── style.css

그리고 여기 내 출력 사이트가 있습니다, 글리피콘을 submit 연락처 페이지의 버튼(아직 UI에 초점을 맞추지 않았기 때문에 기본 사이트에는 표시되지 않음)

흥미롭게도 어딘가에 글리피콘을 놓으면 ~ 아니다 버튼에 표시됩니다.

편집하다:와, 실수로 넣었어 > 수업 이름에.

도움이 되었습니까?

해결책

당신이 가면 http://getbootstrap.com 네트워크 검사기를 보면 어떤 글꼴도 로드되지 않는 것을 볼 수 있습니다.하지만 만약 당신이 간다면 http://getbootstrap.com/comComponents/, 브라우저에서 점프하는 것을 볼 수 있습니다.

브라우저는 필요한 경우에만 글꼴을 로드합니다. 글리피콘-xxx 스타일).이것은 ... 불리운다 지연 로딩 불필요한 리소스 로드를 방지합니다.

편집하다 :사이트에서 글리피콘을 사용하지 않으면 로드되지 않습니다.기본 Jekyll Bootstrap은 글리피콘을 사용하지 않습니다.

추가해 보세요 파일 중 하나(예:페이지.html) 또는 index.md에 해당하는 마크다운을 추가하면 네트워크 검사기에서 글꼴이 로드되는 것을 볼 수 있습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top