푸터

푸터는 화면을 구성하는 가장 마지막 요소로 헤더와 본문에서 원하는 정보를 찾지 못하였거나 사이트 구조 탐색 중에 길을 잃은 사용자들이 대면하게 되는 정보이다.

푸터는 화면을 구성하는 가장 마지막 요소로 헤더와 본문에서 원하는 정보를 찾지 못하였거나 사이트 구조 탐색 중에 길을 잃은 사용자들이 대면하게 되는 정보이다.

사용 지침

본문 흐름이 끝난 뒤 사용자가 추가 정보나 약관·개인정보처리방침에 접근할 수 있도록 항상 페이지 마지막에 배치하고, 화면 너비에 따라 컬럼 수를 조정합니다.

예제

Default

examples/footer/FooterDefault.tsx
import { siInstagram, siYoutube, siX, siFacebook, siNaver } from "simple-icons"
import {
  Footer,

Minimal

국민건강보험공단

(26464) 강원특별자치도 원주시 건강로 32(반곡동) 국민건강보험공단

© 2023 National Health Insurance Service. All rights reserved.

examples/footer/FooterMinimal.tsx
import {
  Footer,
  FooterAddress,

Simple

국민건강보험공단

© 2023 National Health Insurance Service. All rights reserved.

examples/footer/FooterSimple.tsx
import { Footer, FooterCopyright, FooterLogo } from "@/components/ui/dynamic/footer"

export default function FooterSimple() {

속성

이름타입기본값설명
aria-labelstringDefines a string value that labels the current element. @see aria-labelledby.
classNamestring
idstring
onClickMouseEventHandler<HTMLElement>
styleCSSProperties
tabIndexnumber