여러분이 사용하고 계신 브라우저는 HTML5를 지원하지 않기 때문에 몇몇 요소가 제대로 보이도록 JScript를 사용하고 있습니다. 하지만 여러분의 브라우저 설정에서 스크립트 기능이 꺼져있으므로, 현재 페이지를 제대로 확인하시려면 스크립트 기능을 켜주셔야 합니다. w3.css - 구글 글꼴
w3.css – 구글 글꼴
3주전 작성
2개월전 수정

w3.css

구글 글꼴

W3.CSS를 사용하면 새 글꼴을 추가하는 것이 매우 쉽다.

  • 사용하기 매우 쉽다(CSS 및 HTML만 해당).
  • 외부 글꼴 라이브러리 무제한 사용(예: Google 글꼴)
  • 모든 최신 브라우저에서 작동

Google 글꼴 사용

Google 글꼴은 무료로 사용할 수 있으며 선택할 수 있는 글꼴이 1000개 이상 있다.

웹페이지 헤드에 Google 글꼴 링크를 추가한다.

예제
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto">
body,h1,h2,h3,h4,h5,h6 {font-family: Roboto, sans-serif;}
기본 예시
예제 보기

다른 예시

예제
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Sofia">
body,h1,h2,h3,h4,h5,h6 {font-family: Sofia, serif;}
기본 예시
예제 보기

글꼴 클래스 만들기

웹페이지 헤드에 Google 글꼴 링크를 추가한다.

예제
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Sofia">

 

그런 다음 글꼴 클래스를 만든다.

예제
.w3-sofia {
  font-family: Sofia, cursive;
}

 

웹페이지에서 글꼴 클래스를 사용한다.

<p class="w3-sofia">Making the Web!</p>
기본 예시
예제 보기
참고
Mingg`s Diary
밍구
공부 목적 블로그