웹폰트를 다운받아 적용할대 CSS에 쓰는 부분..
본문
일단 웹폰트를 다운 받아 변환하고 서버에 올렸습니다.
http://blog.naver.com/naan_ace?Redirect=Log&logNo=220073900577
요기를 보고 했습니다.
서버에 ttf 라는 폴더에 넣었습니다.
그리고 디폴트 CSS를 수정중인데요.;;;
@charset "utf-8";
@font-face{
font-family:"Nanum Gothic";
src:url('../../ttf/NanumGothic.eot');
src:url('../../ttf/NanumGothic.eot?#iefix') format('embedded-opentype'),
url('../../ttf/NanumGothic.woff') format('woff'),
url('../../ttf/NanumGothic.ttf') format('truetype');
url('../../ttf/NanumGothic.svg#NanumGothic') format('svg')
src:local(※), url('../../ttf/NanumGothic.woff') format('woff');
/* SIR 지운아빠 */
/* 초기화 */
html {overflow-y:scroll}
body {margin:0;padding:0;font-size:0.75em;font-family:NanumGothic}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family:NanumGothic}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
#hd ul, nav ul, #ft ul {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-family:NanumGothic;font-size:1em}
button {cursor:pointer}
이렇게 했는데 맞게 한걸까요?
적용이 안되는거 같습니다..ㅠㅠ
답변 3
@font-face{
font-family:"Nanum Gothic";
src:url('/css/fonts/NanumGothic.eot');
src:url('/css/fonts/NanumGothic.eot?#iefix') format('embedded-opentype'),
url('/css/fonts/NanumGothic.woff') format('woff'),
url('/css/fonts/NanumGothic.ttf') format('truetype');
url('/css/fonts/NanumGothic.svg#NanumGothic') format('svg')
src:local(※), url('/css/fonts/NanumGothic.woff') format('woff');
}
저도 이렇게 사용중이에요 위 처럼 폰트 정의해주고 적용할곳에
#tit_js {
font-family:'Nanum Gothic',sans-serif;
font-size:22px;
font-weight:bold;
color:#4d4d5f;
}
이렇게 사용하시면 됩니다.
탈환대님 default.css 에 윗쪽 구문을 첨부하면 사이트 전체에 적용되는거 아녀요? ㅠㅠ
#tit_js {
font-family:'Nanum Gothic',sans-serif;
font-size:22px;
font-weight:bold;
color:#4d4d5f;
}
이 부분은 따로 넣어야 하는건가요? ㅠㅠ
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
body {font-family: 'Nanum Gothic', serif;}
이렇게 간단하게 사용가능하세요
음 이걸 최 상단에 올리면 되는 건가요? 밑에는 다 지우구요?
위에 사용하신 태그는 폰트를 불러오는 것이고 적용하실려면
body 든지 해당 id 든지 css 적용을 해주셔야 합니다.
탈환대님 감사합니다..^^:;;
