CSS

fontello

딩벳폰트는 폰트 대신 어떤 문자에 해당하는 이미지로 이루어진 폰트를 의미합니다. fontello는 딩벳이나 아이콘을 폰트로 제공하는 여러 서비스를 모아둔 서비스입니다. 특히 SVG 파일을 업로드하면 폰트로 만들어주기도 합니다. 

fontello.com

여기서는 폰트텔로를 이용해서 아이콘을 웹페이지에 삽입하는 방법을 알아봅니다. 

소개

사용법

원리 

폰트 만들기 & 유지보수

댓글

댓글 본문
작성자
비밀번호
  1. Joohyun Song
    아 저도 완주했습니다. HTML 에 이어 CSS 까지..
    이제 JS 로 넘어갑니다.
    감사합니다.
  2. protester
    아...드뎌 완주했어요~! 감사합니다!
  3. nevertoolate
    감사합니다. JS 강의 듣고 나서 다시 CSS 복습하러 올께요.
  4. 잉여로운코더
    감사합니다 덕분에 좋은 내용 잘 듣고 갑니다.
  5. Je-Hyeong Kim
    감사합니다!
  6. 세븐나이츠
    css 강의 아주 잘 들엇습니다
  7. 어린왕자
    CSS 강의 잘 들었습니다.
    자세한 설명 감사합니다.
  8. 0529 완료했어요 :)
  9. 아리시마
    17.5.13 CSS 한번 다봤습니다 ㅎㅎ..
    좋은 강의네요 ..

    새로운 기능 많이 알아갑니다.

    홈페이지 제작하고 있는데 한번 잘 활용해보고 모르면 다시 복습해볼깨요 !
  10. php가 첫취업?
    알아두면 좋은 과목이었네요...일단...초보자가 듣기에는 안들어도 된다고 하신거 제외하고..
    나머지를 이해하는 작업을 할까합니다..
  11. php가 첫취업?
    드디어 1회 완주했습니다...html php와는 다르게 알아둬야할 부수적인 기능들이 너무 많아 보여서 힘드네요....
    1회 완주 배속으로 일단 들엇으니..
    이제 이해 안가는 항목들만 순서대로...보통 속도로 다시 재시작할까합니다
  12. 고베베
    와~ 드디어 1회 완주했네요.
    정말 많은 도움 받고 갑니다.

    제 것으로 만들기 위해 노력 좀 하고 JAVASCRIPT도 시작해야겠어요~!
    감사합니다.
  13. 묘로리
    너~무유용하다 ㅠ ㅠ
  14. 삐꾸돼지
    2017.2.1 CSS 1번 완주 하였습니다. 좋은 강의 만들어주셔서 감사합니다^^.
    2회 3회 ,,, 10회 까지 개속 공부하면서 열심히하겠습니다
  15. 곧프로그래머
    코드를 똑같이 쳐도 폰트가 안나오고 계속 네모만 뜨는건 왜 그러는건가요.... 답답ㅠㅠ...
  16. cancaodosang
    아이콘을 구글cdn을 이용해서 웹페이지에 삽입시켜 사용했었어어요.
    그런데 어느날 갑자기 아이콘이 한쪽 구석에서 멈춰서 작동을 안하는거예에요.
    왜 일까 하고 살펴보던 중, 구글cdn안에 hide라는 속성이 원치 않게 삽입되어 있었어어요.
    hide라는 단어를 지우고 싶었지만, 지워지도 않고, 그 홈버튼 아이콘 하나때문에, 웹페이지가
    엉망으로 엉켜서 뒤죽박죽이 되어 버렸습니다.

    내가 원하는 건, 내가 만든 간단한 아이콘 한개를,한쪽 구석에 배치하는 거였는데,
    그 아이콘 한개를 사용하기 위해, fontello라는 이 화려한 기능을 사용해야 하는 것일까!
    하는 생각을 합니다. 1억개의 아이콘을 무료로, 무한대로 사용할 수 있는데,
    난 내 웹페이지에 한개의 아이콘을 삽입하지 못해서, 발 동동 구르는 기분이랄까요!
  17. 폭스킴
    중간에 슬럼프가 좀 있었지만 간신히 완주했네요~ 너무나 감사드립니다. ^^

    그리고 질문 하나 드려요~

    fontello에서 이용한 폰트는 라이센스가 어떻게 되나요? (thenounproject도요~)

    무료로 자유롭게 사용할 수 있는 건가요?
  18. 임지호
    fontello : 아이콘을 폰트의 형태로 바꿔서 사용할 수 있게 하는 기술
    - 사용법 : <i class="해당 폰트 이름"></i>

    16.12.24 css수업 끝!!
  19. 감사합니다:)
  20. 지선
    끝까지좋은강의감사합니다~!
  21. 시간이 너무없어서 css 실습을 못하고 완주했네요.. ㅠ 나중에 한번 더 보러와야겠어요 제일 좋았던 파트는 flex 와 mediaquery였습니다. 좋은강의 감사합니다.
  22. sSll바버미니llSs
    강의 완주했습니다. 감사합니다!!
  23. 개발하는윰주
    친절하고 세세한 강의 감사드립니다! 너무 좋은 강의였어요!
  24. 호걸노바
    좋은 강의 잘 들었습니다. 감사합니다.
  25. 박중신
    CSS 강의도 완주했습니다. 감사합니다 :)
  26. Chizcake
    좋은 강의 만들어주셔서 감사합니다 :)
    덕분에 CSS에 대한 막연한 두려움에서 조금이나마 벗어날 수 있게 되었어요.

    앞으로도 좋은 강의 많이 만들어주세요!
  27. 박정호
    감사해요
  28. 생활코딩회원중의 한 명입니다.
    좋은 강의 감사드립니다. 꾸벅~
  29. 갤럭시
    감사합니다~
  30. happychallenge
    감사합니다. 사랑합니다. 이렇게 좋은 강의를 무료로 해 주셔서 감사합니다.
    작지만 저도 후원을 하겠습니다.
  31. 마엘
    정말 잘 들었습니다. 언제나 감사합니다!!
  32. 감사해요
    진짜 잘 들었습니다.
    유튭 채널에서 들어서 사이트에 댓글은 처음 달아요.
    좋은 자료 감사합니다.
    제가 드리는 무한한 감사를 받으세요!!
  33. 코딩신
    CSS강의 정말 잘 들었습니다!

    감사합니다
  34. Wj Kim
    훌륭한 강의 잘 들었습니다. 감사합니다. (_._)
  35. 다은아빠
    좋은 강의 잘 들었습니다.
버전 관리
egoing
현재 버전
선택 버전
graphittie 자세히 보기