웹 폰트
웹폰트
CSS3부터 웹 폰트를 표준으로 채택하여 웹 페이지에 폰트를 일괄적으로 적용할 수 있게 되었다.
웹 폰트는 직접 업로드하여 변환해 사용할 수 있다.
PC에서 사용하는 폰트는 TrueType(TTF)이나 용량이 커서 웹에서 적합하지 않다. 웹에서는 EOT(Embedded open type)이나 WOFF(Web Open Foot Format)을 사용하며 최근에는 WOFF2 파일도 많이 사용한다.
한글까지 웹 폰트 변환 가능한 사이트 : Transfonter (https://transfonter.org)
출처 : 웹 표준의 정석 (고경희 저)
웹 폰트 사용의 기본형 (@font-face)
@font-face {
font-famliy: <글꼴 이름>;
src: <글꼴 파일>;
}
눈누 웹 폰트 이용 하기
눈누 사이트 https://noonnu.cc/
눈누
상업용 무료한글폰트 사이트
noonnu.cc
1. 웹폰트 찾기
2. 웹폰트 CSS 태그를 복사하여 <style> 내부에 붙여넣기
3. 사용하고자 하는 클래스, ID, 태그에 CSS 적용하기
/* body에서 사용하는 모든 h1 태그에 사용해라. */
h1 {
font-family:'Ownglyph_meetme-Rg';
}
/* 이 경우
/* body에서 사용하는 모든 body 태그에 사용해라. */
body {
font-family:'Ownglyph_meetme-Rg';
}
구글 웹 폰트 이용하기
'Programing > CSS' 카테고리의 다른 글
CSS Grid (0) | 2024.02.24 |
---|---|
부트스트랩 사용 (0) | 2024.02.22 |
별도의 CSS 파일을 불러 모든 웹페이지에 동일하게 적용하기 (0) | 2024.02.22 |
CSS Media Query (0) | 2024.02.22 |
CSS의 기본 문법 (0) | 2024.02.22 |
댓글