如何更改离子图标的标题?

时间:2021-03-05 00:18:17

标签: html css ionicons

我正在尝试更改鼠标悬停时出现的离子图标标题。
示例:pic
我已经尝试了至少几个小时来找到解决方案。我只是不知道如何通过 css 访问 ion-icon 的标题元素,以便能够将其内容更改为“编辑”而不是“创建”。任何帮助将不胜感激。

2 个答案:

答案 0 :(得分:2)

禁用事件:

ion-icon {
    pointer-events: none;
}

并使用标题属性用span标签包裹图标:

<span title="Edit" style="font-size: x-large;">
  <ion-icon name="create"></ion-icon>
</span>

答案 1 :(得分:1)

您可以尝试使用 CSS 事件阻止禁用离子图标弹出窗口,并将“title”属性设置为父元素。

CSS

ion-icon {
 pointer-events: none;
}

或者您可以使用以下代码创建图标元素作为解决方法并将其设置在按钮上。

const icon = <Icon icon='arrow-right' title={false} />;
return <Button minimal icon={icon} title='Next' />;

此处的详细信息 - https://github.com/palantir/blueprint/issues/2321

相关问题