Aller au composant de lien de contenu - Skeuomorphisme en niveaux de gris
Un lien simple et réactif « Skip to Content » avec un design skeuomorphique en niveaux de gris pour le contenu du blog. Inclut la prise en charge du mode sombre.
HTML Code
<a href="#main-content" class="skip-to-content-link sr-only focus:not-sr-only focus:absolute focus:top-4 focus:left-4 focus:bg-gray-200 focus:text-gray-900 focus:px-4 focus:py-2 focus:rounded focus:shadow-lg dark:focus:bg-gray-700 dark:focus:text-gray-100 dark:focus:shadow-xl">Skip to content</a>
<main id="main-content" class="p-4">
<!-- Your main content goes here -->
<h1 class="text-2xl font-bold mb-4 text-gray-800 dark:text-gray-200">Main Content Area</h1>
<p class="text-gray-700 dark:text-gray-300">This is the main content of the page. The "Skip to content" link will bring you here.</p>
</main>
Composants associés
Aller au lien de contenu
Composant de lien aligné sur les principes de Material Design, avec une conception réactive, la prise en charge du mode sombre et une palette de couleurs monochromatique simple pour les applications de médias sociaux.
Aller au composant de lien de contenu
Un composant Web qui fournit un lien « Passer au contenu » de style 3D avec des effets réactifs et la prise en charge du thème sombre, à l’aide de Tailwind CSS.
Aller au lien de contenu
Un composant de lien Skip to Content avec un style de conception Neumorphism, une palette de couleurs triadique et une mise en page complexe pour les blogs et les sites Web de contenu. Il inclut un design réactif et la prise en charge du mode sombre à l’aide de Tailwind CSS.