티스토리 뷰
반응형
font-family 속성
font-family : "글꼴1", 글꼴2, 글꼴3 형식으로 사용
글꼴1번이 없을경우 글꼴2로 대체되고 글꼴 2도 없을경우 글꼴 3으로 표시합니다. 만약 글꼴 3도 없을 경우 기본 글꼴로 적용됩니다.
폰트는 사용자 시스템의 글꼴을 반영하기 때문에 사용자 컴퓨터에 폰트가 없을경우 기본 글꼴로 표시됩니다.
개발자가 자기가 정한 글꼴을 보여주고 싶을 경우에는 웹폰트를 사용하면됩니다.
웹폰트는 구글 웹 폰트 나눔 고딕 기준으로
https://fonts.google.com/earlyaccess
만약 특정폰트를 적용하고 싶을경우에는 ttf, woff, otf, eot, svg, svgz 폰트를 업로드하여 적용가능합니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>취미코딩</title>
<style type="text/css">
@FONT-FACE {
font-family: 'naBrush';
src:url("NanumBrush.woff");
}
</style>
</head>
<body>
<p style="font-family: naBrush;">스타일을 적용해 볼께요.</p>
<p>스타일 미적용 입니다.</p>
</body>
</html>
적용 결과 화면입니다.
반응형
'HTML, CSS' 카테고리의 다른 글
HTML 반응형웹 폰트 단위 (em, rem) (0) | 2017.06.30 |
---|---|
HTML5 구조 및 시맨틱 요소 알아보기 (0) | 2017.06.23 |
HTML style태그 간단히 알아보기 (0) | 2017.06.12 |
HTML 폼태그 간단히 알아보기 (0) | 2017.06.11 |
HTML 현 페이지 특정위치로 이동하기 (0) | 2017.06.11 |
댓글
최근에 올라온 글
최근에 달린 댓글