科技感联系界面 Tailwind网站组件

<section class="bg-gray-900 py-16"> <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="text-center mb-12"> <h2 class="text-4xl font-bold text-white mb-4"> <span class="bg-gradient-to-r from-cyan-400 to-blue-400 bg-clip-text text-transparent">联系我们</span> </h2> <p class="text-xl text-gray-400">技术支持与咨询服务</p> </div> <div class="bg-gray-800 rounded-2xl border border-gray-700 p-8 shadow-2xl"> <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> <div class="space-y-6"> <div class="flex items-center space-x-4 p-4 bg-gray-700 rounded-lg border border-cyan-500"> <div class="w-3 h-3 bg-cyan-400 rounded-full animate-pulse"></div> <div> <h4 class="text-white font-semibold">24/7 技术支持</h4> <p class="text-gray-400">support@tech.com</p> </div> </div> <div class="flex items-center space-x-4 p-4 bg-gray-700 rounded-lg border border-blue-500"> <div class="w-3 h-3 bg-blue-400 rounded-full animate-pulse"></div> <div> <h4 class="text-white font-semibold">在线服务</h4> <p class="text-gray-400">+86 400-999-8888</p> </div> </div> <div class="flex items-center space-x-4 p-4 bg-gray-700 rounded-lg border border-purple-500"> <div class="w-3 h-3 bg-purple-400 rounded-full animate-pulse"></div> <div> <h4 class="text-white font-semibold">研发中心</h4> <p class="text-gray-400">杭州市西湖区文三路</p> </div> </div> </div> <div class="space-y-4"> <input type="text" placeholder="用户名" class="w-full p-3 bg-gray-700 border border-gray-600 rounded-lg text-white focus:border-cyan-400 focus:outline-none"> <input type="email" placeholder="邮箱地址" class="w-full p-3 bg-gray-700 border border-gray-600 rounded-lg text-white focus:border-cyan-400 focus:outline-none"> <textarea placeholder="技术问题描述" rows="4" class="w-full p-3 bg-gray-700 border border-gray-600 rounded-lg text-white focus:border-cyan-400 focus:outline-none">