跳至内容链接

跳至符合 Material Design 原则的内容链接组件,该组件具有响应式设计、深色模式支持和适用于社交媒体应用程序的简单单色配色方案。

预览

HTML 代码

<a href="#content" class="skip-to-content block absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-full bg-blue-500 text-white p-3 transition-all duration-300 focus:translate-y-0 z-50 dark:bg-blue-700 dark:text-gray-200">Skip to content</a>

相关组件

跳至内容链接组件

一个干净、极简的“跳到内容”链接组件,适用于运动/健身应用程序,采用灰度配色方案设计。它响应式并支持深色模式,强调排版和可访问性。

打开

跳至内容链接

用于辅助功能的“跳至内容”链接组件,专为具有灰度配色方案的深色模式仪表板而设计。由于响应式和深色模式样式,它比较复杂。不使用 JavaScript。使用带有 dark: 前缀的 Tailwind CSS 来支持深色主题。

打开

跳至内容链接

用于 Web 应用程序中辅助功能的极简跳至内容链接,专为仪表板设计。

打开