Webfont(웹폰트)
- 폰트를 내 PC나 서버에 저장하지 않고
링크를 불러와서 사용하는 방법
- Google Font가 가장 유명, 한글은 눈누 사이트가 유명
- <link>와 CSS 적용 방식을 copy하여 내 소스에서
붙여넣고 사용
웹 폰트는 구글폰트가 대표적이다.
링크 : https://fonts.google.com/
☆ Code
<!doctype html>
<html>
<head>
<title>WebFonts</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&family=Noto+Sans+KR:wght@100..900&display=swap" rel="stylesheet">
<style>
#newfont1 {
font-family: "Noto Sans KR";
}
#newfont2 {
font-family: "Nanum Pen Script";
}
</style>
</head>
<body>
<h1>이게 원래 폰트다.</h1>
<h1 id="newfont1">이건 한 번 바꾼 폰트다.</h1>
<h1 id="newfont2">이건 또 바꾼 폰트다.</h1>
</body>
</html>'CSS' 카테고리의 다른 글
| CSS flex 디스플레이 (0) | 2024.11.25 |
|---|---|
| CSS 디스플레이 포지션 (0) | 2024.11.25 |