차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

양쪽 이전 판이전 판
다음 판
이전 판
tech:fontawesome [2014/12/31 23:32] SC Yootech:fontawesome [2016/07/12 09:26] (현재) – 바깥 편집 127.0.0.1
줄 1: 줄 1:
-====== Fontawesome ======+{{tag>fontawesome 웹디자인 도쿠위키 dokuwiki}} 
 +====== 폰트어썸 (Fontawesome======
  
-홈피 +아이콘을 텍스트화해서 크기와 색깔 변경이 쉬우며 이미지보다 용량이 작아서 여러모로 좋다. 
 +[[bootstrap]]에 [[glyphicons]]이 포함되어 있긴 한데, 저작권 문제도 살짝 있고, 이게 더 나은 것 같다. 
 +홈페이지에서 제공되는 아이콘이  많으니 확인해서 원하는 아이콘으로 변경할 수 있다. 
 + 
 +홈피
 http://fortawesome.github.io/Font-Awesome/ http://fortawesome.github.io/Font-Awesome/
  
 아이콘목록 아이콘목록
 http://fortawesome.github.io/Font-Awesome/icons/ http://fortawesome.github.io/Font-Awesome/icons/
 +
 +=====사용법=====
 +
 +HTML ''<head>''와 ''</head>'' 사이에
 +
 +  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
 +를 삽입한다.
 +
 +이제 본문에서 
 +  <i class="fa fa-camera-retro"></i>
 +이런식으로 ''<i>''태그를 이용해서 쓰면 됨..
 +
 +[예제](http://fortawesome.github.io/Font-Awesome/examples) 참조.
 +
 +  <i class="fa fa-camera-retro"></i> fa-camera-retro
 +
 +
 +<faicon fa fa-camera-retro> 
 +
 +=====도쿠위키=====
 +
 +도쿠위키에서는
 +사용하는 템플릿에서 지원한다면 (그냥 헤드부분에서 불러오는 명령 추가)
 +[플러긴]( https://www.dokuwiki.org/plugin:fontawesome) 을 깔고
 +
 +  <faicon fa fa-phone> 
 +
 +위와 같은 문법으로 도쿠위키 본문 중에서도 사용할 수 있다.  <faicon fa fa-phone>  <faicon fa fa-camera-retro> 
 +
 +아아 유연한 도쿠위키... 
  
  
-예제  
-http://fortawesome.github.io/Font-Awesome/examples 
  
-{{tag>fontawesome}}+=====같이보기===== 
 +  * [[Glyphicons]]