[Html] Font Awesome(폰트 어썸) 오류 해결법

Font Awesome을 사용 하다보면 사진과 같이 네모로 표기가 되는 경우가 있다.

 

이번 포스팅은 Font Awesome의 오류법을 해결하는 법이다.

 

 

---

1. 로컬파일 확인

간단한 방법이지만 놓치고 가는 경우가 많다.

로컬에서 Font Awesome의 font나 css, js가 하나라도 빠지면 오류가 나는 경우가 종종 발생한다.

놓치고 간 파일들을 로컬에 추가하면 해결이 된다.

---

2. CDN

로컬이 아닌 CDN으로 외부링크를 걸었을 경우

css 스타일 링크만 걸려있는 상태이므로, js가 빠질수도 있다. 이경우 js를 로컬로 연결할 경우 해결할수 있다.

---

3. font-weight

폰트굵기가 300, 500, 또는 700일 경우 오류가 생기는 경우가 종종 있다.

.fa,.fab,.fad,.fal,.far,.fas{
	font-weight: 900 !important;
	}

css 부분에 위 코드를 추가하면 해결이 된다.