HTML 코드
<footer class="bg-gray-100 dark:bg-gray-900 text-gray-700 dark:text-gray-300 py-8">
<div class="container mx-auto px-4">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="mb-4 md:mb-0">
<p class="text-sm">© 2023 Your Blog Name. All rights reserved.</p>
</div>
<nav>
<ul class="flex space-x-4">
<li><a href="#" class="text-sm hover:text-gray-900 dark:hover:text-white">Home</a></li>
<li><a href="#" class="text-sm hover:text-gray-900 dark:hover:text-white">About</a></li>
<li><a href="#" class="text-sm hover:text-gray-900 dark:hover:text-white">Contact</a></li>
</ul>
</nav>
</div>
</div>
</footer>
관련 구성 요소
Footer Navigation 구성 요소
머티리얼 디자인(Material Design) 원칙과 비즈니스/기업 웹사이트를 위한 유사한 색 구성표로 스타일이 지정된 간단한 바닥글 탐색 구성 요소입니다. 다크 모드를 지원하며 반응형입니다.
Glassmorphism 바닥글 탐색
Glassmorphism 스타일, 생생한 색 구성표 및 대시보드 목적을 위한 복잡한 레이아웃이 있는 바닥글 탐색 구성 요소. Tailwind CSS를 사용하여 다크 모드를 지원하는 반응형 디자인.
바닥글 탐색 구성 요소 - 고정/개발자 스타일
농업/농업 웹사이트용으로 설계된 복잡하고 반응이 빠른 바닥글 탐색 구성 요소로, 그라데이션 무지개 색 구성표와 다크 모드 지원이 있는 고정 공간/개발자 미학을 특징으로 합니다.