跳过内容链接组件

一个具有磨砂玻璃效果、模糊、响应性和暗模式支持的跳转内容链接，使用Tailwind CSS，无需JavaScript。

预览

HTML 代码

<a href="#content" class="block sr-only focus:not-sr-only focus:absolute focus:top-4 focus:left-4 focus:z-50 focus:bg-white/30 focus:backdrop-filter focus:backdrop-blur-lg focus:text-gray-800 focus:px-4 focus:py-2 focus:rounded-md dark:focus:bg-gray-800/30 dark:focus:text-white">Skip to Content</a>

相关组件

跳至内容链接组件

一个提供跳转到主要内容链接的网页组件，采用材料设计风格，配有粉彩色彩方案，适用于电子商务网站。它具有响应式设计，并支持黑暗主题。

打开

跳至内容链接

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

打开

跳转到内容链接

响应式“跳到内容”链接组件，采用 Glassmorphism 设置样式，实现互补配色方案、适度复杂性和深色模式支持，适用于商业/公司网站。此组件完全使用 Tailwind CSS 类在 HTML 中实现，不需要 JavaScript。

打开