[Web] 구글 웹 폰트 - ( week 1)

구글에서 제공하는 웹 폰트를 사용하면 웹 페이지에 원하는 폰트를 적용할 수 있다.

 

Google Web Font

 

해당 사이트에 방문해서 원하는 폰트를 선택한다.

옆에 떠있는 창에서 @import를 선택하고 style 태그 사이에 있는 코드를 복사해서 작성 중이던 코드의 style 태그 내부 최상단에 붙여 넣기 해준다.

 

다시 폰트 사이트로 돌가서 이번엔 CSS rules to specify families 코드를 복사한다.

그리고 이번엔 * 를 사용하여 대상을 지정하고 다음과 같이 코드를 추가해 준다.

    <style>

        @import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');

        * {

            font-family: 'VT323', monospace;

        }

 

* 는 전체를 대상으로 한다는 의미로 해달 폰트를 페이지 전체 텍스트에 적용시킨다는 의미이다.

 

정리하면

@import를 통해서 사용하고자 하는 폰트를 구글에서 제공하는 경로를 통해서 다운로드하고 * {}로 웹 페이지 전체 텍스트의 폰트를 정해주는 것이다.