fontawesome 표시 안 함◻사각형으로 변할 때의 대처법
잘 보이지 않는 상황에서의 해결 모델을 소개해 드리겠습니다.
버전 확인
버전부터 확인해 볼까요?
CDN을 사용하는 경우 링크에 버전이 적혀 있습니다. 거기를 확인하십시오.<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
"v5.8.2"입니다.
2019년 5월까지 이 버전은 최신이다.
이전 버전은 4에서 시작된 버전입니다.<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
4.7.0이라고 적혀 있다.
이 버전에 따라 사용할 수 있는 아이콘의 종류와 css에서 지정한 방법이 달라집니다.
사용 가능한 아이콘 확인
각 버전에서 사용할 수 있는 아이콘을 확인하는 방법은 다음과 같습니다.
우선 일반fontawesome의 페이지에서 검색한 결과 새 버전의 본능이 사용하는 아이콘이다.
첫 페이지 아래 부분의 ↓ 빨간색 테두리로 둘러싸인 곳에서 날아온 곳은 구버전에서 사용할 수 있는 아이콘 일람이다.
CSS 지정 확인
CSS에 지정된 경우 content: "\f105";
느낌으로 기술합니다.
버전에 따라 font-family를 지정해야 합니다.
새 버전li::before {
font-family: "Font Awesome 5 Free";
content: "\f105";
}
이전 버전li::before {
font-family: FontAwesome;
content: "\f105";
}
Free 아이콘
PRO 아이콘은 유료 버전만 사용할 수 있습니다. 주의하십시오.
기타
또한 Font-weight의 값을 바꾸면 표시됩니다.
이 기사에 쓰인 방법으로 표현할 수 있다면 다행이다!
Reference
이 문제에 관하여(fontawesome 표시 안 함◻사각형으로 변할 때의 대처법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/szaizen/items/ef13ee3f25a71cec5b2a
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
li::before {
font-family: "Font Awesome 5 Free";
content: "\f105";
}
li::before {
font-family: FontAwesome;
content: "\f105";
}
PRO 아이콘은 유료 버전만 사용할 수 있습니다. 주의하십시오.
기타
또한 Font-weight의 값을 바꾸면 표시됩니다.
이 기사에 쓰인 방법으로 표현할 수 있다면 다행이다!
Reference
이 문제에 관하여(fontawesome 표시 안 함◻사각형으로 변할 때의 대처법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/szaizen/items/ef13ee3f25a71cec5b2a
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여(fontawesome 표시 안 함◻사각형으로 변할 때의 대처법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/szaizen/items/ef13ee3f25a71cec5b2a텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)