font css 폰트 적용하기

 

 

폰트 글꼴 적용 CSS

body{
	font-family: "NanumSquare","맑은 고딕", sans-serif;
}

 

Valul 값

 

글꼴이름 : 공백이 있는 글꼴이름은 "" 따옴표로 묶어줘야 한다. (예시 : "맑은 고딕")

inherit : 부모 글꼴 상속

 

 

 

구글 폰트 가져오기

https://fonts.google.com/

Google Fonts

 

font-style

https://developer.mozilla.org/en-US/docs/Web/CSS/font-style

font-style - CSS: Cascading Style Sheets | MDN

font-style: normal;
font-style: italic;
font-style: oblique;
font-style: oblique 10deg;

/* Global values */
font-style: inherit;
font-style: initial;
font-style: unset;

 

 

font-size

https://developer.mozilla.org/ko/docs/Web/CSS/font-size

font-size - CSS: Cascading Style Sheets | MDN

 

/* <absolute-size> 값 */
font-size: xx-small;
font-size: x-small;
font-size: small;
font-size: medium;
font-size: large;
font-size: x-large;
font-size: xx-large;

/* <relative-size> 값 */
font-size: larger;
font-size: smaller;

/* <length> 값 */
font-size: 12px;
font-size: 0.8em;

/* <percentage> 값 */
font-size: 80%;

/* 전역 값 */
font-size: inherit;
font-size: initial;
font-size: unset;

 

value 값

xx-small, x-small, small, medium, large, x-large, xx-large

사용자의 기본 폰트(medium)의 크기를 기준으로 두고 정해지며 <font size="1">부터 <font size="7">과 같이 유사하게 표현됩니다. 기본 유저 폰트 크기는 <font size="3">입니다.

 

larger, smaller

키워드에 따라 부모 엘리먼트의 폰트 크기에서 일정 비율로 늘이거나 줄입니다.

 

font-size : 80%는

16*0.8(기본폰트 *0.8)