2/13 티스토리 글꼴 바꾸는 작업

카테고리 없음 2018. 2. 13. 13:50    Print Friendly Version of this pagePrint Get a PDF version of this webpagePDF

2/13 CSS (em, letter-spacing, 웹폰트 eot)

2.2em 앞에 정한 크기의 상태 크기 2.2em은 앞 크기의 2.2.배

letter-spacing:1.2px;  글자가 점유하는 공간을 나타냄. 1.2px면 글꼴 크기의 120%. 장평의 개념.

블로그에 글꼴 적용하기 (제목 나눔 스퀘어라운드 볼드, 본문 나눔 바른펜 레귤러 또는 바른고딕 레귤러)

1. 글꼴 다운로드와 설치

2. TTF를 EOT 또는 WOFF 파일로 바꾸기 https://onlinefontconverter.com/
(안내 http://koreawebdesign.com/font-to-webfont-convert/)

onlinefontconverter.com(나눔바른펜).zip

onlinefontconverter.com(나눔스퀘어라운드).zip

onlinefontconverter.com(나눔바른고딕).zip


3. 티스토리에 적용 (안내글)

* 티스토리관리-스킨변경-스킨편집-HTML편집-파일업로드에 웹폰트를 업로드.

* CSS 항목 맨 위에 아래와 같은 방식으로 줄 추가 (이 폰트를 사용할 것이라고 정의함) 

※ 몇 가지 폰트를 동시에 사용하고 싶어서 이곳에 추가하여 기록하니 아무 변화가 없었다. 

@FONT-FACE {

font-family: "NanumBarunGothic";

src : url('./images/NanumBarunGothic.woff');

}

* css 에서 아래 부분을 찾아 수정한다. (보통 맨 위에 있음. 빨간 글씨가 바른고딕폰트를 위해 수정한 부분)

/* 반드시 들어가야 하는 스타일 시작 */

/* 1. 본문 전체  */

body, td, input, textarea {

font-family: NanumBarunGothic, "나눔 바른 고딕", "맑은 고딕", Lucida Grande, Tahoma, Arial, Helvetica, sans-serif; 

         /* Lucida Grande for the Macs, Tahoma for the PCs */\




Trackbacks 0 : Comments 0

Write a comment