组件 页脚 页脚组件

页脚组件

一个简单的社交媒体暗模式页脚组件,带有互补色彩方案。

预览

HTML 代码

<footer class="bg-gray-800 text-white py-4">
    <div class="container mx-auto flex flex-col items-center">
        <div class="flex space-x-4 mb-3">
            <a href="#" class="text-gray-400 hover:text-gray-200">About</a>
            <a href="#" class="text-gray-400 hover:text-gray-200">Contact</a>
            <a href="#" class="text-gray-400 hover:text-gray-200">Privacy Policy</a>
        </div>
        <div class="flex space-x-4 mb-3">
            <a href="#" class="text-gray-400 hover:text-gray-200">
                <img src="https://picsum.photos/30/30" alt="Facebook" class="inline-block">
            </a>
            <a href="#" class="text-gray-400 hover:text-gray-200">
                <img src="https://picsum.photos/30/30" alt="Twitter" class="inline-block">
            </a>
            <a href="#" class="text-gray-400 hover:text-gray-200">
                <img src="https://picsum.photos/30/30" alt="Instagram" class="inline-block">
            </a>
        </div>
        <div class="text-center">
            <p class="text-gray-400">© 2023 Your Company. All rights reserved.</p>
        </div>
    </div>
</footer>

相关组件

极简社交媒体页脚

一个为社交媒体界面设计的极简页脚组件,采用土色调配色方案。响应式并支持黑暗主题。

打开

页脚组件 页脚

一个简单的页脚组件,具有微妙的 Skeuomorphism 设计,使用类似的配色方案。它包括版权声明、一些导航链接和社交媒体图标。该设计响应式并支持深色模式。

打开

页脚组件

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

打开