메뉴 건너뛰기

XE : Xpress Engine




웹디자인 강의

기타 [참조] 웹폰트 사용하기..

2002.03.06 01:49

mo2ni

[참고] 웹 폰트를 바로 홈페이지에 적용 하기

html 파일의 <head> 와 </head> 사이에

<STYLE TYPE="text/css">
<!--
@font-face {
font-family: Arial;
font-style: normal;
font-weight: normal;
src: url(ARIAL0.eot); }
-->
</STYLE>

위와 같이 추가 합니다 이때 font-family 에 스페이스바가 들어가면 "font family" 처럼 따옴표로
묶어야 합니다.

폰트를 사용 할 때에는

<font FACE=Arial SIZE=5> a b c d e f g </font>

위와 같이 해 주면 됩니다.



- 웹 폰트를 스타일 시트 (CSS)를 이용 해서 적용 하기 -

제 홈페이지를 예로 들면

@font-face {
    font-family:NT-SandollGothicN;
    src: url(http://shelter.zoa.to/NTSANDO1.eot);
}
body, table, tr, td, select,input,div,form,textarea, font
{
font-size:9pt;
font-family:NT-SandollGothicN;
}

style.css 파일에 다음과 같이 추가 합니다.
이때 font-family 에 스페이스바가 들어가면 "font family" 처럼 따옴표로 묶어야 합니다.

html 파일의 <head>와  </head> 사이에

<link rel="StyleSheet" href="style.css" type="text/css" rel="stylesheet" type="text/css" href="style.css">

위와 같이 추가 합니다.


-mo2ni-

[ 출처 : http://shelter.zoa.to/ ]
번호 제목 글쓴이 날짜 조회 수
공지 공지 강좌를 올리기전 공지사항을 읽어주세요 [12] Eccen 2004.12.15 48031
2335 포토샵 7.0 - 18. 채널과 엠보스필터 서기 2005.11.11 2850
2334 [퍼니페인트]키르님의 물결 만들기 - 페인트샵으로..;; [6] funnyPSP 2002.03.09 2860
2333 [동영상] 제2강 Spline(2차원도형)/Extrude(2차원도형 돌출)/Selection(선택하는 방법들) 인테리어뱅크 2006.04.11 2865
2332 [photoshop_6.0 기초강좌-03]_팔레트, 포토샵 메뉴, 이미지 작업, 툴 박스 등 [2] file rosun 2005.08.06 2866
2331 [psp6]국왕의 허접;; 우선;; 초 허접 부터; 레이어의 기본개념 [1] file 국왕-_-)/ 2002.02.22 2902
2330 [제15강]모바일용 콘텐츠제작하기 에듀멘 2006.03.17 2969
2329 Ryumir의 허접강좌 -1- [13] file 늘함께했던 2003.01.18 2970
2328 Motiondive Tokyo 동영상 강좌 오버뷰 [1] 덴디 2004.12.24 2990
2327 제1강 플래시 시작하기 - 드로잉 명령 익히기-06 file 최승철 2005.03.13 3003
2326 [퍼니페인트]기하효과를 이용한 이상한 공과 나비? 만들기 [11] 대현 2003.01.26 3007
2325 공모전,자료전에 활용하세요[다음강좌 - 3D맥스강좌올려드리겠습니다] 에듀멘 2006.03.21 3015
2324 [photoshop_6.0 기초강좌-19]_패턴 만들어서 사용하기 file rosun 2005.08.07 3031
2323 간단한 팁입니다. [4] file Click 2002.11.03 3036
2322 제1강 3ds 시작하기 - 드로잉 명령 익히기-05 file 최승철 2005.03.13 3039
2321 C++ 강의 입니다. 무료구요! [3] croW 2006.02.26 3040
2320 [힐링포션의 그림판강의] 그림판의 실행, 브러시 크기조절, 색편집 [5] 힐링포션 2002.05.02 3043
2319 [프로모션]애니메이터의작업처럼 라이트박스기능활용 [3] 정현석 2002.08.27 3070
2318 [나모웹 초보자] 스크립트 마법사③ file 나만의길 2004.07.18 3074
2317 간단팁~!! 브러시 크기 단축키 [8] 아이의별 2003.01.22 3080
2316 [팁]칼라팁 그두번째 이야기입니다 [6] ECKS 2003.02.07 3086