Font-family 편집

Table of Contents (보이기↓)

edit

개요

이 속성은 요소에 특정 글꼴이나 "대표 글꼴"을 지정한다. 특정 글꼴은 사용자의 시스템 환경에 의존하므로, "대표 글꼴"을 반드시 지정하길 권장한다.

브라우저에 따라 쉽표가 아닌 공백(space)으로 글꼴 이름을 구분할 수 있으므로, 공백을 갖는 글꼴 가족 이름들은 따옴표로 묶어야 한다. (예: "맑은 고딕")

사용자의 시스템에 설치되지 않은 글꼴을 대비해서, 다양한 글꼴 이름을 순서대로 지정한다. 첫번째 지정한 글꼴이 사용자 시스템에 설치되어 있으면, 해당 글꼴이 출력된다. 그렇지 않으면, 두번째 지정한 글꼴을, 그도 아니면 세번째 글꼴을 출력한다. 만일 지정한 글꼴이 모두 설치되지 않았다면, 브라우저에서 지정한 기본 글꼴이 적용된다.

사용자의 시스템 글꼴이란 운영체제와 설치한 응용프로그램에 의해 로컬 컴퓨터에서 사용할 수 있는 글꼴이다. 예를 들어, 맥(mac) 사용자는 굴림과 돋움 글꼴을 사용할 수 없다.

edit

정의

Font-family설명
값[ [<글꼴 이름> | <대표 글꼴>],]* [<글꼴 이름> | <대표 글꼴>] | inherit
기본값화면 표시 장치의 기본 스타일 참조
적용대상모든 요소
상속가능
백분율사용 불가
미디어visual

edit

값

값설명
<글꼴 이름>글꼴 이름을 지정한다. 글꼴 이름은 쉼표(,)로 구분한다.
<대표 글꼴>'serif', 'sans-serif', 'cursive', 'fantasy', 'monospace'의 대표 글꼴을 지정한다. 대표 글꼴 이름은 키워드?이므로, 따옴표로 묶으면 안된다.
inherit부모 요소의 값을 상속하도록 지정한다.

edit

예제

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
	p {font-family: "바탕", batang, serif;}
</style>
</head>
<body>
	<p>본문의 글꼴을 "바탕"으로 지정한다.</p>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
	p {font-family: "굴림", gulim, serif;}
</style>
</head>
<body>
	<p>본문의 글꼴을 "굴림"으로 지정한다.</p>
</body>
</html>

edit

브라우저 호환성

값IE6IE7FF2Op9
(Family name)지원지원지원지원
serif지원지원지원지원
sans-serif지원지원지원지원
cursive지원지원지원지원
fantasy지원지원지원지원
monospace지원지원지원지원
inherit미지원미지원지원지원

Wiki Trail: < 음성 | 문서 목록 | font-weight >

 
Be Friend~! Be Friend~!