极简线条联系 Tailwind网站组件

<section class="bg-gray-50 rounded-none border-2 border-gray-900 p-12 md:p-16"> <div class="max-w-4xl mx-auto"> <div class="text-center mb-16"> <h2 class="text-5xl md:text-6xl font-light text-gray-900 mb-8 tracking-tight"> CONTACT </h2> <div class="w-24 h-0.5 bg-gray-900 mx-auto mb-8"></div> <p class="text-gray-600 text-lg font-light max-w-xl mx-auto"> 简单直接的沟通方式，专业高效的服务体验 </p> </div> <div class="grid lg:grid-cols-2 gap-16"> <div> <h3 class="text-2xl font-light text-gray-900 mb-8 tracking-wide">INFORMATION</h3> <div class="space-y-8"> <div class="border-l-2 border-gray-900 pl-6"> <h4 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">ADDRESS</h4> <p class="text-gray-900 font-light"> 南京市鼓楼区中山路321号<br> 新世纪广场A座15楼 </p> </div> <div class="border-l-2 border-gray-900 pl-6"> <h4 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">PHONE</h4> <p class="text-gray-900 font-light">+86 138 0013 8000</p> </div> <div class="border-l-2 border-gray-900 pl-6"> <h4 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">EMAIL</h4> <p class="text-gray-900 font-light">contact@minimal.com</p> </div> <div class="border-l-2 border-gray-900 pl-6"> <h4 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">HOURS</h4> <p class="text-gray-900 font-light"> MON - FRI / 9:00 - 18:00<br> SAT - SUN / 10:00 - 16:00 </p> </div> </div> </div> <div> <h3 class="text-2xl font-light text-gray-900 mb-8 tracking-wide">MESSAGE</h3> <form class="space-y-6"> <div> <input type="text" placeholder="NAME *" class="w-full px-0 py-4 border-0 border-b border-gray-300 focus:border-gray-900 focus:ring-0 focus:outline-none text-gray-900 placeholder-gray-400 font-light tracking-wide"> </div> <div> <input type="email" placeholder="EMAIL *" class="w-full px-0 py-4 border-0 border-b border-gray-300 focus:border-gray-900 focus:ring-0 focus:outline-none text-gray-900 placeholder-gray-400 font-light tracking-wide"> </div> <div> <input type="text" placeholder="SUBJECT" class="w-full px-0 py-4 border-0 border-b border-gray-300 focus:border-gray-900 focus:ring-0 focus:outline-none text-gray-900 placeholder-gray-400 font-light tracking-wide"> </div> <div> <textarea placeholder="MESSAGE *" rows="5" class="w-full px-0 py-4 border-0 border-b border-gray-300 focus:border-gray-900 focus:ring-0 focus:outline-none text-gray-900 placeholder-gray-400 font-light tracking-wide resize-none">