コンテンツリンクにスキップする

ビジネスWebサイト用の3Dグレースケールデザインのコンテンツリンクコンポーネントにスキップします。レスポンシブで、Tailwind CSSを使用したダークモードをサポートしています。JavaScript はありません。

プレビュー

HTMLコード

<a href="#main-content" class="skip-to-content-link sr-only focus:not-sr-only focus:absolute focus:top-0 a-3 focus:left-0 focus:z-50 block px-4 py-3 text-lg font-semibold text-gray-800 bg-gray-200 border-b-4 border-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-700 focus:ring-opacity-50 dark:text-gray-200 dark:bg-gray-800 dark:border-gray-300 dark:focus:ring-gray-300">Skip to main content</a>

関連コンポーネント

コンテンツリンクコンポーネントにスキップする

Neumorphism スタイルとアーストーンの配色を持つダッシュボードの応答性の高い [コンテンツにスキップ] リンクコンポーネント。

開ける

コンテンツリンクにスキップする

コンテンツリンクコンポーネントにスキップマテリアルデザインの原則、単色の配色、およびサポートするダークモードでスタイル化されたコンポーネント。eコマースWebサイトに適しており、JavaScriptなしでTailwind CSSを使用して構築されています。

開ける

コンテンツリンクコンポーネントにスキップ - Skeuomorphism グレースケール

ブログコンテンツ用のグレースケールのSkeuomorphicデザインを使用したシンプルでレスポンシブな「コンテンツにスキップ」リンク。ダークモードのサポートが含まれています。

開ける