链接

链接元素用于调用应用操作和在页面（路由）之间进行导航

链接布局

<a class="link" href="path/to/somewhere">Link Text</a>

如果你使用带图标和文本的链接，那么推荐以下布局：

<a class="link" href="path/to/somewhere">
  <i class="icon"></i>
  <span>Link Text</span>
</a>

如果你只使用带图标的链接，那么：

<a class="link icon-only" href="path/to/somewhere">
  <i class="icon"></i>
</a>

跳过链接处理器

可以跳过 F7 链接处理器（如果你想在链接中添加自定义逻辑，或者想让它指向外部网站）。在这种情况下，我们需要额外的external class:

<a class="link external" href="http://google.com">Open Google</a>

CSS 变量

以下是相关CSS 变量(CSS 自定义属性) 的列表。

:root {
  --f7-link-highlight-black: rgba(0, 0, 0, 0.1);
  --f7-link-highlight-white: rgba(255, 255, 255, 0.15);
  --f7-link-highlight-color: rgba(var(--f7-theme-color-rgb), 0.15);
}
.ios {
  --f7-link-pressed-opacity: 0.3;
}