Skip to main content

ion-icon

Icon 是一个简单的组件，通过 Ionicons 库提供，该库默认随所有 Ionic Framework 应用预打包提供。它可以用于显示 Ionicons 集合中的任何图标，或自定义 SVG。它还支持诸如大小和颜色之类的样式设置。

有关所有可用图标的列表，请参见 ionic.io/ionicons。有关更多信息，包括样式和自定义 SVG 使用，请参见 使用页面。

基本用法​

🌐 Basic Usage

无障碍​

🌐 Accessibility

纯粹用于装饰的图标应具有 aria-hidden="true"。这不会在视觉上隐藏图标，但会将该元素从辅助技术中隐藏。

<ion-icon name="heart" aria-hidden="true"></ion-icon>

如果图标是可交互的，应通过添加 aria-label 来定义替代文本。

<ion-icon name="heart" aria-label="Favorite"></ion-icon>

或者，如果图标位于它所描述的另一个元素内部，该元素应添加aria-label，并且图标应使用aria-hidden隐藏。

<ion-button aria-label="Favorite">
  <ion-icon name="heart" aria-hidden="true"></ion-icon>
</ion-button>

目录