programing

일부 부트스트랩 글리폰이 로드되지 않음

css3 2023. 10. 12. 23:24

일부 부트스트랩 글리폰이 로드되지 않음

부트스트랩 새스 소스로 구축하는 워드프레스 테마가 있습니다.스타일은 효과가 있지만 대부분의 글리폰은 효과가 없습니다(아스타리스크와 플러스만 해당).제 부트스트랩을 정리하고 있습니다style.css그리고 그것과 관련된 폴더가 있습니다.fonts글리피콘을 보유하고 있는 (나는 다음과 같이 설정합니다.$icon-font-path: "fonts/";) 다음은 제가 편집한 부분입니다.style.css글꼴 경로가 올바른지 표시하기:

@font-face { font-family: 'Glyphicons Halflings'; src: url("fonts/glyphicons-halflings-regular.eot"); src: url("fonts/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("fonts/glyphicons-halflings-regular.woff2") format("woff2"), url("fonts/glyphicons-halflings-regular.woff") format("woff"), url("fonts/glyphicons-halflings-regular.ttf") format("truetype"), url("fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg"); }
.glyphicon { position: relative; top: 1px; display: inline-block; font-family: 'Glyphicons Halflings'; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

예를 들어 다음과 같은 작업을 수행합니다.

<span class="glyphicon glyphicon-asterisk" aria-hidden="true"></span>
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>

하지만 이들은 그렇지 않습니다.

<span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span>
<span class="glyphicon glyphicon-heart" aria-hidden="true"></span>

글리폰 클래스의 일부분은 다음과 같습니다.

.glyphicon-asterisk:before { content: "\2a"; }
.glyphicon-plus:before { content: "\2b"; }  
.glyphicon-star:before { content: \e006; }
.glyphicon-thumbs-up:before { content: \e125; }

glyphicon 글꼴을 로드하고 있는지 네트워크 탭을 확인해보니 glyphicon이 작동할 때만 나타납니다(별표, 더하기).그렇지 않으면 글꼴 파일이 네트워크 탭에 표시되지도 않습니다.404).

문제는 내용 값이 따옴표로 감싸지지 않았다는 것입니다. 문제는 여전히 www.getbootstrap.com sass 소스 다운로드의 문제이지만 최근 부트스트랩 sass github repo에서 해결되었습니다.

언급URL : https://stackoverflow.com/questions/28267666/some-bootstrap-glyphicons-not-loading