Skip to content
On this page

Tooltip 文字提示

常用于展示鼠标 hover 时的提示信息。

基础用法

使用position 属性来定义 tooltip 显示的方向。

箭头

使用 arrow属性来控制是否需要显示箭头

主题

Tooltip 组件内置了两个主题:light 和 dark。自定义主题通过添加非内置类名来实现, 通过设置 theme 属性来修改主题,默认值为 dark.

TIP

建议您使用自定义主题时不要使用线性渐变背景颜色。 因为弹出箭头和内容是两个不同的元素, 弹出箭头的样式需要单独设置,当它到渐变背景颜色时,会看起来很奇怪。


Tooltip API

Tooltip 属性

属性名说明类型可选值默认值
content文字内容string--------------------
position提示框显示发方向stringtop/right/bottom/lefttop
theme提示框的主题string-----------------dark
arrow是否显示箭头boolean-----------------true