360° 뷰어 구성 요소
다크 모드를 지원하는 Tailwind CSS를 사용하는 미니멀하고 반응이 빠른 360° 뷰어 구성 요소입니다.
HTML 코드
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg overflow-hidden p-4">
<h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200 mb-4">360° Viewer</h2>
<div class="flex justify-center mb-4">
<img src="https://picsum.photos/700/400?random=1" alt="360° View" class="rounded-lg transition-transform duration-500 ease-in-out hover:scale-105">
</div>
<p class="text-gray-600 dark:text-gray-400 mb-2">Experience the object in 360° view. Hover to zoom in.</p>
<a href="#" class="text-blue-500 dark:text-blue-400 hover:underline">Learn more about this view</a>
</div>
관련 구성 요소
360 Viewer 구성 요소
Tailwind CSS로 구축된 다크 모드 지원 및 반응형 디자인을 갖춘 360° 뷰어 구성 요소입니다. JavaScript가 필요하지 않으며 스타일링 및 응답성을 위해 CSS만 사용합니다.
360° 뷰어 구성 요소
전자 상거래를 위해 설계된 반응형 360도 뷰어 구성 요소로, 다크 모드를 지원합니다. 스타일링은 파스텔 색상의 레트로/빈티지입니다. HTML 및 Tailwind CSS만 사용합니다.