搜索组件

类别

组件页脚

页脚

网站底部区域，包括联系信息、版权等

页脚组件

一个极简主义风格的页脚组件，带有响应式效果和黑暗主题支持，使用Tailwind CSS。

                <footer class="bg-gray-800 text-white p-10 flex flex-col items-center justify-center">  <div class="flex flex-wrap justify-center">    <div class="m-5">      <h4 class="text-2xl font-bold mb-2">Contact Us</h4>      <p class="text-lg">Email: [email protected]</p>      <p class="text-lg">Phone: (123) 456-7890</p>    </div>    <div class="m-5">      <h4 class="text-2xl font-bold mb-2">Follow Us</h4>      <div class="flex space-x-4">        <a href="#" class="text-lg hover:text-gray-400">Facebook</a>        <a href="#" class="text-lg hover:text-gray-400">Twitter</a>        <a href="#" class="text-lg hover:text-gray-400">Instagram</a>      </div>    </div>    <div class="m-5">      <h4 class="text-2xl font-bold mb-2">About Us</h4>      <p class="text-lg">We are a company that values...</p>    </div>  </div>  <div class="flex flex-wrap justify-center mt-10">    <img class="rounded-full h-16 w-16 m-2" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Avatar 1">    <img class="rounded-full h-16 w-16 m-2" src="https://randomuser.me/api/portraits/women/32.jpg" alt="Avatar 2">    <img class="rounded-full h-16 w-16 m-2" src="https://randomuser.me/api/portraits/men/34.jpg" alt="Avatar 3">  </div>  <div class="mt-10 text-center">    <p class="text-sm">© 2023 Example Company. All Rights Reserved.</p>  </div>  <style>    @media (prefers-color-scheme: dark) {      .bg-gray-800 { background-color: #1a1a1a; }      .text-white { color: #f0f0f0; }      .hover\:text-gray-400:hover { color: #a0a0a0; }    }  </style> </footer>