Semantic-ui에서 탭을 사용할 수 없을 때의 처리 방법

1623 단어 StyleSheetSemanticUI
전제 조건
semantic uibootstrap에서 쓴 js/css 프레임워크입니다.
bootstrap에 비해 그 목적은 외관상으로 그 뜻을 이해하기 쉽다는 것이다.
증세
Semantic ui아이콘에서도 사용할 수 있지만 적당한 방법을 사용하면 움직이지 않을 때도 있습니다.
<i icon='wifi-icon'></i> ←見えない!
이럴 때는 글꼴 아이콘의 성공 여부를 확인하는 것이 좋다.

만약 파일을 가져오는 데 실패한다면, 다운로드할 적당한 글꼴 파일을 적당한 곳에 두지 않았을 가능성이 높다.
구체적으로 css 파일이 놓여 있는 곳을 상대적인 경로로 보면 /themes/default/assets/fonts 아이콘 파일을 찾을 수 있다.
대책
요청받은 곳에 디렉터리를 파서 아이콘 파일을 놓는 것 자체가 쉽지만 그렇기 때문에 3층과 디렉터리를 모두 파야 하고 기존 글씨체 방치장과 일관성도 생각해야 하니 아이콘을 찾는 곳으로 고쳐 쓰자.
구체적으로 semantic.css와는 달리 읽은 자신의 css 파일에 다음과 같은 내용을 적으세요.
mypage.css
@font-face {
  font-family: 'Icons';
  src: url("fonts/icons.woff2") format('woff');
}
또한 fonts 디렉터리 아래에 Semantic ui 이하icons.woff2를 놓으면 동작합니다.

좋은 웹페이지 즐겨찾기