Zum Content Link springen - Retro Monochromatic
Weiter zu Content Link Component mit Retro-/Vintage-Design, monochromatischem Farbschema und einfacher Komplexität.
HTML-Code
```html
<a href="#main-content" class="sr-only focus:not-sr-only fixed z-50 top-4 left-4 bg-stone-800 text-stone-100 px-6 py-3 rounded-md text-lg font-mono tracking-wide uppercase focus:outline-none focus:ring-2 focus:ring-stone-500 focus:ring-opacity-75 dark:bg-stone-100 dark:text-stone-800 dark:focus:ring-stone-400">
Skip to Content
</a>
<div id="main-content" class="focus:outline-none" tabindex="-1">
<!-- Page content goes here -->
</div>
```
Verwandte Komponenten
Zur Inhaltslink-Komponente springen
Eine visuell ansprechende "Skip to Content"-Link-Komponente, die für Dashboards mit Schwerpunkt auf Mikrointeraktionen entwickelt wurde, unter Verwendung eines komplementären Farbschemas und der Unterstützung des Dunkelmodus durch Tailwind CSS.
Zur Inhaltslink-Komponente springen
Eine einfache, zugängliche Skip-to-Content-Link-Komponente, die für Reise-/Tourismus-Websites entwickelt wurde, mit einem sepia/braunen Farbschema und Unterstützung für den Dunkelmodus, um die Belastung der Augen zu reduzieren.
Zum Inhaltslink springen
Eine "Zum Inhalt springen"-Linkkomponente für die Barrierefreiheit, die für Dark-Mode-Dashboards mit einem Graustufen-Farbschema entwickelt wurde. Es ist aufgrund des reaktionsschnellen und dunklen Modus-Stylings mäßig komplex. Es wird kein JavaScript verwendet. Verwendet Tailwind CSS mit dark:-Präfixen für die Unterstützung des dunklen Designs.