[ITWILL : WEB]폰트속성

ITWILL학원 : 9강 WEB(HTML, CSS) BY 김영희

1. font속성(폰트속성)

속성은 크게 두가지 그룹이 있다

• font
• text

그 중 폰트속성 먼저 알아보면 아래와 같다.

font 속성종류	특징
font-size	글자 크기
font-weight	글자 두께
font-style	글자 기울기
font-family	글자(서체) 지정

2. font-size

다양한 단위가 있다.
실무에서 주로 쓰이는 단위는 px, pt(포인트)이다.

참고링크 : 폰트사이즈변환

3.font-family

한글 본문은 고민하지말고 맑은 고딕으로 쓰면 된다.

• 기본폰트 :
  기본글꼴종류는 크게 세 가지로 나뉜다

1. Sans-serif 고딕형 : sans의 의미는 without이다. 글자의 끝이 딱 떨어지는 느낌, 가독성이 제일 좋음
2. Serif : 끝에 장식이 있는 클래식한 느낌
3. Monospace : 고정글꼴. width가 same한 글꼴이다.
   글꼴이름을 넣을때는 쌍따옴표를 넣고 글꼴종류를 적을때는 쌍따옴표를 적으면 안된다.

참고링크 : w3schol

• 웹폰트 :
  폰트패밀리로 기본폰트를 지정해주었을 때, 만약 사용자의 컴퓨터에 해당 폰트가 없다면 폰트 적용이 아예 안된다.
  이를 예방하기위해 웹폰트를 사용할 수 있다. 사용자가 굳이 다운로드하지않더라고 웹폰트가 적용된 채로 홈페이지를 볼 수 있다.
  • 웹폰트는 무료도 있고 유료도 있지만 제일 유명한 구글폰트는 무료이다.
  • 구글웹폰트
  • 구글웹폰트깃허브 : 한글
  • 눈누 : 한글폰트로 유로뿐만 아니라 무료상업용웹폰트도 쉽게 찾을 수 있다.

웹폰트 사용법은 간단하다.

1. 해당 웹폰트의 html의 link태그를 복사하여 head태그 사이에 붙여넣기.
2. 해당 웹폰트의 css코드를 복사하여 css페이지에 붙여넣기.