홈페이지를 만들다보면 아이콘을 넣을 일이 굉장히 많다. 이런 짜잘짜잘한 아이콘을 다 포토샵에서 잘라가지고 저장해가지고 업로드해서 경로쓰고.....때에따라선 크기도 일일이 css로 조절하고... 얼마나 귀찮은지 ;ㅅ;
이런 귀찮음을 줄여주는 Font Awesome!
fontawsome은 한마디로 font icon이다. 우리가 웹상에서 쓰는 텍스트와 똑같이 아이콘을 만드는것. 그래서 css로 color지정도 굉장히 쉽다.
폰트어썸을 사용하려면, 직접 파일을 업로드 하는 방법도 있겠지만 역시 가장간편한건 cdn주소를 사용하는거다 :)
<head></head> 사이에
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
이것만 써주면 끝! 그리고 필요한게 있으면 폰트 어썸에서 아이콘을 검색해서 태그만 복붙하면 된다 ㅎ.ㅎ
class명을 줌으로써 크기 조절, 돌리기, 반전 등등 여러가지 기능을 사용할수 있다. 진짜 겁나편리함.
728x90
'퍼블리싱 > HTML | CSS | Javascript' 카테고리의 다른 글
css rwd grid (0) | 2017.04.05 |
---|---|
CSS - flexbox (0) | 2017.04.05 |
background animate (0) | 2017.04.04 |
jquery-ui 2 (0) | 2017.04.02 |
jquery-ui 1 (0) | 2017.04.02 |