728x90
๋ฐ์ํ
CSS _ํฐํธ(font)_font-family
font๋ ํฐํธ ์คํ์ผ์ ๋ฐ๊พธ๊ธฐ ์ํ ์์ฑ๋ช
์ผ๋ก font-()๋ค์ ๋ด์ฉ์ ๋ฐ๋ผ
ํฐํธ์ ์คํ์ผ์ ๋ณํ๋ฅผ ์ค ์ ์์!
↓↓↓
[ CSS - font ๋ฌธ๋ฒ ]
<style>
์ ํ์ { font-์์ฑ: ์์ฑ๊ฐ; }
</style>
โถ CSS์์ ์์ฃผ ์ฌ์ฉํ๋ font์ ์์ฑ์ ๋๋ค.
โถ font-family
ใด ํฐํธ์ ๊ธ๊ผด์ ์ค์
ใด ์์ฑ๊ฐ์ด ์ฌ๋ฌ ๊ฐ์ ๊ธ๊ผด๋ก ์ค์ ๋์ด ์์ผ๋ฉด, ์ ํ์๋ ์์๋๋ก ๊ธ๊ผด์ ์ ์ฉ
โป ์ฌ๋ฌ ๊ฐ์ ๊ธ๊ผด์ ๋์ดํ ๋์๋ ์ผํ(,)๋ก ๊ตฌ๋ถ
โถ font-family ์ฌ์ฉ ๋ฐฉ๋ฒ
<style>
์ ํ์ { font-family: ๊ธ๊ผด์ข
๋ฅ; }
</style>
โถ font-family ์ค์ ์์
[ html - css ์์ฑ ์ฝ๋ ]
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>font-family</title>
<style>
.family1 { font-family: "Times New Roman", Times, serif; }
/* ๊ธ๊ผด์ด ๋์ด์ฐ๊ธฐ๊ฐ ์๋๊ฒฝ์ฐ""๋ฅผ ์ฌ์ฉํด์ ์์ฑ */
.family2 { font-family: Arial, Helvetica, sans-serif; }
</style>
</head>
<body>
<h1>font-family</h1>
<h3>font-family : ํฐํธ์ ๊ธ๊ผด์ ์ค์ ํ๋ ์์ฑ</h3>
<p class="family1">Times New Roman ๊ธ๊ผด ์ ์ฉ</p>
<p class="family2">Arial ๊ธ๊ผด ์ ์ฉ</p>
</body>
</html>
[ ์คํ ํ๋ฉด์ ๋ณํ ]
↓ css style ์ ์ฉ ํ๋ฉด
↓ css style ์ ์ฉ ํ๋ฉด
728x90
๋ฐ์ํ
'๐ปCoding > ๐ CSS' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
| CSS _์ปฌ๋ฌ_color (0) | 2021.11.23 |
|---|---|
| CSS _ํฐํธ(font)_font-weight (0) | 2021.11.22 |
| CSS _์ ํ์_์์ฑ ์ ํ์(attribute selectors) (0) | 2021.11.19 |
| CSS _hover (0) | 2021.10.26 |
| CSS _์ ํ์_๊ทธ๋ฃน์ ํ์ (2) | 2021.09.13 |