@font-face 룰을 사용하면 원하는 글꼴을 자유롭게 사용할 수 있습니다.
@font-face { <descriptor: value; descriptor: value; ...> }
Descriptor
- font-family
- <family-name>
정의된 글꼴에 사용할 이름을 지정합니다. - font-feature-settings
- normal | <feature-tag-value>#
- font-stretch
- normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded
- font-style
- normal | italic | oblique
- font-variant
- normal | [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> || stylistic(<feature-value-name>) || historical-forms || styleset(<feature-value-name>#) || character-variant(<feature-value-name>#) || swash(<feature-value-name>) || ornaments(<feature-value-name>) || annotation(<feature-value-name>) || [ small-caps | all-small-caps | petite-caps | all-petite-caps | titling-caps | unicase ] || <numeric-figure-values> || <numeric-spacing-values> || <numeric-fraction-values> || ordinal || slashed-zero || <east-asian-variant-values> || <east-asian-width-values> || ruby ]
- font-weight
- normal | bold | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
- src
- [ <uri> [format(<string>#)]? | <font-face-name> ]#
string은 woff, truetype, opentype, embedded-opentype, svg 중 하나 입니다. - unicode-range
- <urange>#
@font-face {
font-family: MainText;
src: local("Gentium"), url(gentium.ttf);
unicode-range: U+000-5FF, U+1e00-1fff, U+2000-2300;
}
