발생 상황
1) <head> 안에 <script src ~> or <link href ~> 방식으로 바꿔봐도 아이콘 깨짐
2) 다른 아이콘으로 바꿔봐도 아이콘이 깨져서 나옴
해결 방안
열심히 구글링하다가 다른 사람의 코드 앞에 fas 또는 fab가 붙어 있는 것을 발견함.
fas를 붙여주니 아이콘이 이상 없이 잘 나왔다.
수정 전 코드
<div class="logo">
<i class="fa-thin fa-person-running"></i>
<a href="">test</a>
</div>수정 후 코드
<div class="logo">
<i class="fas fa-thin fa-person-running"></i>
<a href="">test</a>
</div>Font Awesome이 버전 5로 업데이트되면서 사용법이 복잡해졌는데 (유료화가 되면서 스타일 분리됨), 버전 5는 fa-solid라고 표현하지만, 현재는 버전 6이기 때문에 무료 아이콘의 경우, fas 또는 fab라고 표현한다고 한다.
*무료는 fas와 fab만 사용 가능
'🗂ㅤ작업 노트 > 에러 회고' 카테고리의 다른 글
| [MariaDB] The TCP Port you selected is already in use... (Windows) (0) | 2023.11.30 |
|---|---|
| [IntelliJ /SpringBoot] Cannot resolve class or package 'mysql' (0) | 2023.07.26 |
| [Spring] Failed to load ApplicationContext 에러 (0) | 2023.07.19 |
| [ intelliJ ] Invalid Gradle JDK configuration found 에러 (0) | 2023.07.17 |
| [ intelliJ ] Cause: invalid source release: 11 에러 (0) | 2023.07.15 |