뚝딱햄 탈출기

[HTML][CSS] 구글 웹폰트 적용 본문

web

[HTML][CSS] 구글 웹폰트 적용

hyrmzz1 2023. 8. 15. 18:32
  1. 구글 웹폰트 https://fonts.google.com/?subset=korean 에서 원하는 폰트 골라 클릭.

  2.  하단의 Styles 에서 원하는 style을 골라 Select style_name + 클릭.
  3. 우측 상단의 모음 아이콘 (View selected families) 클릭.


  4.  모음 아이콘을 클릭하면 다음과 같이 나타난다.
    1. 주의) 이전에 추가한 폰트도 review에 뜬다.
      적용하고자 하는 폰트 외의 폰트는 (review에서) - icon을 눌러 제외시켜준다. 
    2.  Use on the web 에서 <link> 를 선택하고, 아래의 <link> tag를 복사해 html의 <head> tag 내에 붙여 넣는다.
    3. CSS rules to specify families 아래의 코드는 복사하여 css 파일 내에 붙여넣는다.
      • html 의 head tag 내에 css 작성한다면?
        <head> tag 내의 <style></style> 에 붙여넣기.
      • 별도의 css 파일을 생성했다면?
        폰트를 적용하고자 하는 대상에 붙여넣기. (전체적으로 적용하려면 * {} 내부에 복붙)

저작자표시 비영리 변경금지

'web' 카테고리의 다른 글

Ajax : 개념, 실습  (0) 2023.10.09
부트스트랩 Bootstrap : 개념, 실습  (2) 2023.10.08
[html] 로그인 화면 만들기 : form, input, label, button, submit  (0) 2023.10.08
웹의 동작 개념 : Web API, JSON  (2) 2023.10.05
HTML, CSS, Javascript : CSS 선택자, CSS 사용법, JS 사용법  (0) 2023.08.15
'web' Related Articles more
Comments