组件
Link 链接
文本链接样式:默认、弱化、无下划线、禁用;:focus-visible 轮廓环。
变体
<p class="pvs-m-0">
<a class="pvs-link" href="#">默认链接</a> · <a class="pvs-link pvs-link--muted" href="#">弱化</a> · <a class="pvs-link pvs-link--no-underline" href="#">无下划线</a> · <a class="pvs-link pvs-link--disabled" href="#" tabindex="-1">禁用</a>
</p>场景示例
段落、面包屑、列表中的链接。
<p class="pvs-m-0 pvs-text-sm">阅读 <a class="pvs-link" href="#">入门指南</a> 或查看 <a class="pvs-link pvs-link--muted" href="#">变更记录</a>。</p>
<ul class="pvs-breadcrumb pvs-mt-3">
<li class="pvs-breadcrumb__item">
<a class="pvs-breadcrumb__link pvs-link" href="#">文档</a>
</li>
<li class="pvs-breadcrumb__item pvs-breadcrumb__item--active">链接</li>
</ul>类名速查
| 类名 | 说明 |
|---|---|
pvs-link | 主色 + 悬停下划线 |
pvs-link--muted | 灰色弱化 |
pvs-link--no-underline | 默认无下划线 |
pvs-link--disabled | 禁用态 |