font-family 속성 : 글꼴 정의
- 여러 개의 글꼴을 기입해서 우선순위 지정
font-size 속성 : 글자 크기 정의
- px : 화소 하나 크기에 대응하는 절대적인 크기
- rem : html 태그의 font-size에 대응하는 상대적인 크기(최상위 태그 대비)
- em : 상위 태그의 font-size에 대응하는 상대적인 크기
text-align 속성 : 정렬 방식 정의
- left, right, center, justify(양 끝 정렬)
color 속성 : 글자 색상 정의
- 키워드 : red, blue, yellow
- RGB 색상 코드 : .#FFFF00
- RGB 함수 : rgb(100%, 100%, 0%)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>폰트 속성</title>
<style>
html{ font-size: 24px;}
h1{ font-family: 돋움, serif, monospace; }
h2{ font-size: 16px}
#qwer{ font-size: 20px;}
h3{ font-size: 2rem;}
h4{ font-size: 1rem;}
span{ font-size: 5em;}
#asdf{
color: #8080FF;
text-align: justify;
}
</style>
</head>
<body>
<h1>Ex) font-family</h1>
<h2>Ex) font-size 16px</h2>
<p id="qwer">Ex) font-size 20px<span>상위 태그 5배 120px</span></p>
<h3>html 2배 48px</h3>
<h4>html 1배 24px</h4>
<p id="asdf">
동해물과 백두산이 마르고 닳도록
하느님이 보우하사 우리나라 만세
무궁화 삼천리 화려강산
대한사람 대한으로 길이 보전하세
남산위에 저 소나무 철갑을 두른 듯
바람서리 불변함은 우리 기상일세
무궁화 삼천리 화려강산
대한사람 대한으로 길이 보전하세
</p>
</body>
</html>