<오늘부터 CSS 마스터 6일차> icon

2023/02/23 카테고리 CSS

Icons

HTML에 아이콘을 넣는 가장 쉬운 방법은 Font Awesome 같은 라이브러리를 사용하는 것이다.

icon 클래스 이름을 i 태그나 span 태그에 inline 형태로 추가하라.

라이브러리 속 모든 아이콘은 CSS(크기, 색상, 그림자 등)로 사용자 정의할 수 있는 확장 가능한 벡터이다.

아래 예시에서는 Font Awesome 라이브러리를 예시로 들었지만, Bootstrap Icons, Google Icons 비슷하다.

<!DOCTYPE html>
<html>
  <head>
    <script
      src="https://kit.fontawesome.com/a076d05399.js"
      crossorigin="anonymous"
    ></script>
  </head>
  <body>
    <i class="fas fa-cloud"></i>
    <i class="fas fa-heart"></i>
    <i class="fas fa-car"></i>
    <i class="fas fa-file"></i>
    <i class="fas fa-bars"></i>
  </body>
</html>

댓글 공유

<오늘부터 CSS 마스터 6일차> icon

Icons

loco9939