Footer Navigation 구성 요소
단색 색 구성표가 있는 Glassmorphism 스타일로 설계된 간단한 바닥글 탐색 구성 요소입니다. 반응형이고 다크 모드를 지원하며 전자 상거래 웹 사이트에 적합합니다.
HTML 코드
<footer class="bg-white bg-opacity-40 backdrop-blur-lg p-6 rounded-lg shadow-lg dark:bg-gray-800 dark:bg-opacity-50">
<div class="container mx-auto flex flex-col sm:flex-row justify-between items-center">
<div class="text-center sm:text-left">
<h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Shop with Us</h2>
<p class="text-sm text-gray-600 dark:text-gray-400">Your online shopping experience starts here.</p>
</div>
<div class="mt-4 sm:mt-0">
<ul class="flex space-x-4">
<li><a href="#" class="text-gray-800 dark:text-gray-200 hover:text-blue-500">Home</a></li>
<li><a href="#" class="text-gray-800 dark:text-gray-200 hover:text-blue-500">Products</a></li>
<li><a href="#" class="text-gray-800 dark:text-gray-200 hover:text-blue-500">About Us</a></li>
<li><a href="#" class="text-gray-800 dark:text-gray-200 hover:text-blue-500">Contact</a></li>
</ul>
</div>
</div>
<div class="mt-6 text-center text-sm text-gray-600 dark:text-gray-400">
<p>© 2023 Your E-commerce. All rights reserved.</p>
</div>
</footer>관련 구성 요소
바닥글 탐색 구성 요소 - Industrial Ocean
이벤트/컨퍼런스 웹 사이트에 적합한 바다/파란색 색 구성표의 산업 스타일의 복잡하고 반응이 빠른 바닥글 탐색 구성 요소입니다. 다중 열 링크, 소셜 미디어 아이콘, 저작권 및 다크 모드 지원이 포함됩니다.
네온글로우바닥글내비게이션
네온/글로우 효과가 있는 반응형 바닥글 탐색 구성 요소로, 음악/오디오 플랫폼용으로 설계되었습니다. 생생한 악센트 색상, 다크 모드 지원 및 시맨틱 HTML이 있는 흑백 색 구성표가 특징입니다.