Guidelines
Practice
Guidelines

메뉴 내 버튼 스타일

메뉴 내 버튼 스타일
.navbar .btn { margin-right: 24px; }
  • margin-right: 24px;: 오른쪽 여백을 24px로 설정합니다.
메뉴 내 버튼 스타일
.fas.fa-arrow-right { margin-left: 8px; font-size: 14px; }
  • margin-left: 8px;: 왼쪽 여백을 8px로 설정합니다. 이를 통해 버튼 안에 있는 화살표 아이콘에 자연스러운 여백을 제공합니다.

  • font-size: 14px;: 아이콘의 글자 크기를 14px로 설정합니다.


아이콘 작성방법

아이콘을 작성하는 방법은 다양합니다. 직접 그리거나 이미지를 사용하는 방법 외에도, fontawesome과 같은 아이콘 라이브러리를 활용할 수 있습니다.

fontawesome 라이브러리 불러오기
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" integrity="sha384-DyZ88mC6Up2uqS4h/KRgHuoeGwBcD4Ng9SiP4dIRy0EXTlnuz47vAwmeGwVChigm" crossorigin="anonymous" />

아이콘 사용을 위해 <link> 태그를 이용하여 fontawesome 라이브러리의 CSS 파일을 불러옵니다. 이를 통해 편리하게 아이콘을 웹 페이지에 적용할 수 있습니다.

fontawesome 라이브러리 사용하기
<i class="fas fa-arrow-right"></i>

fontawesome 라이브러리를 사용하면, 단순히 클래스에 fas fa-arrow-right와 같이 아이콘의 이름을 지정함으로써 쉽게 아이콘을 추가할 수 있습니다. 추가적으로, fontawesome의 공식 웹사이트에서 다양한 아이콘을 검색하여 사용할 수 있습니다.

Guidelines

AI Tutor

Publish

Design

Upload

Notes

Favorites

Help