본문 바로가기
Error

사파리 글꼴이 이상하다..?

by jennyiscoding 2023. 3. 26.

적용이 안되는 이유는 사용자(나)의 브라우저(사파리)에 프리텐다드 라는 글꼴이 없기 때문이였다. 

정의된 첫번째 글꼴을 브라우저에서 찾음 -> 못찾으면 웹폰트 찾음 -> 두번째로 정의된 폰트 찾음 -> 못찾으면 웹폰트 찾음... 이것을 반복하기 때문이다. 

결론적으로 해줘야 할 점. 

 

1. body에 글꼴을 선언할 때 마지막 글꼴에 sans-serif를 추가해야 한다. 

2. 웹폰트를 global.css파일 최상단에 넣어줘야 한다. 

 

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');

html, body {
  font-family: 'Pretendard', sans-serif;
}