아이콘 폰트에 대해서..

 

Icomoon Icon Font

 

 

 

Icon Font Demo 폴더의 demo.html 파일을 열면 현재 스킨에 적용된 모든 아이콘 폰트를 보실 수 있습니다.

 

 

 

 

사용법은..

 

1. HTML

 

글 작성하실 때, 아래와 같은 형식으로 사용하시면 됩니다.

자주 쓰는 아이콘이 있으시면 티스토리의 서식 내지는 윈도우즈의 클립보드에 저장해 놓고 쓰심 편하실 겁니다.

 

<p><span class="icon-appleinc" style="font-size: 1em; margin-right: 8px; color:#006dd7"></span>- 사과</p>
<p><span class="icon-android" style="font-size: 1em; margin-right: 8px; color:#ee2323"></span>- 로봇</p>

 

-  사과

-  로봇

 

 

 

2. CSS

 

스킨의 기본 CSS나 ddPack.css 파일을 수정하실 때는 아래처럼 사용하시면 됩니다.

 

/* <p><span class="exp1"></span> - 사과</p> */
p span.exp1::before { content: '\eabe'; font-family: 'ddPack'; font-size: 1em; margin-right: 8px; color: #006dd7 }

/* <p><span class="exp2"></span> - 로봇</p> */
p span.exp2::before { content: '\eac0'; font-family: 'ddPack'; font-size: 1em; margin-right: 8px; color: #006dd7 }

 

사과

로봇

 

 

 

 

 

블로그 대표 아이콘에 어울리는 폰트

 

 

 

 

<span class="icon-black-cat"></span>
<span class="icon-tistory"></span>
<span class="icon-flower1"></span>
<span class="icon-flower3"></span>
<span class="icon-flower5"></span>
<span class="icon-flower6"></span>
<span class="icon-flower7"></span>
<span class="icon-flower8"></span>
<span class="icon-flower9"></span>
<span class="icon-flower10"></span>
<span class="icon-bird1"></span>
<span class="icon-bird2"></span>
<span class="icon-bird3"></span>
<span class="icon-bird4"></span>
<span class="icon-bird5"></span>
<span class="icon-bird6"></span>
<span class="icon-finger-heart"></span>
<span class="icon-v-camera1"></span>
<span class="icon-v-camera2"></span>