Table des matières
Composant de table des matières avec conception de micro-interactions, schéma de couleurs analogue, complexité simple et objectif de médias sociaux. Réactif avec prise en charge du thème sombre. Pas de code JavaScript.
HTML Code
<nav class="p-4 bg-gray-100 dark:bg-gray-800">
<ul class="space-y-2">
<li><a href="#section1" class="block py-2 px-4 text-gray-700 hover:bg-gray-200 dark:text-gray-300 dark:hover:bg-gray-700 transition duration-300 ease-in-out transform hover:scale-105">Section 1</a></li>
<li><a href="#section2" class="block py-2 px-4 text-gray-700 hover:bg-gray-200 dark:text-gray-300 dark:hover:bg-gray-700 transition duration-300 ease-in-out transform hover:scale-105">Section 2</a></li>
<li><a href="#section3" class="block py-2 px-4 text-gray-700 hover:bg-gray-200 dark:text-gray-300 dark:hover:bg-gray-700 transition duration-300 ease-in-out transform hover:scale-105">Section 3</a></li>
</ul>
</nav>
Composants associés
Table des matières rétro
Composant de table des matières réactif avec design rétro/vintage, schéma de couleurs analogue et prise en charge du mode sombre. Convient aux sites Web d’entreprise. Utilise Tailwind CSS sans JavaScript.
Composant de la table des matières
Composant de table des matières réactif conçu dans le style de l’interface utilisateur du mode sombre, avec des sections, des titres, des descriptions et des images/avatars aléatoires.
RetroEarthDashboardTOC
Composant de table des matières réactif avec un design rétro/vintage, une palette de couleurs de tons de terre et la prise en charge du mode sombre pour l’utilisation du tableau de bord.