react icon ant简单使用

refer: 文字提示 Tooltip - Ant Design

1.首先保证已经引入了Ant

2.在组件(页面)引入tooltip

import { Form, Tooltip } from 'antd';

3.在合适的位置使用tooltip:

复制代码
 <span>
   寿命&nbsp;
   <Tooltip title="这是寿命的说明">
     <QuestionCircleOutlined />
   </Tooltip>
 </span>

解释:

QuestionCircleOutlined是一个中心是问号的圆圈,hover后就可以显示你想要展示在说明里的文字。

相关推荐
若安程序开发5 分钟前
web华为商城前端项目4页面
前端·华为
一枚前端小能手17 分钟前
🏷️ HTML 属性参考 - 常用与全局属性的行为、兼容性与最佳实践
前端·javascript·html
付十一29 分钟前
更新!Figma MCP + Cursor:大前端时代的UI到代码自动化
android·前端·ai编程
万岳科技程序员小金33 分钟前
多端统一的教育系统源码开发详解:Web、小程序与APP的无缝融合
前端·小程序·软件开发·app开发·在线教育系统源码·教育培训app开发·教育培训小程序
软件架构师-叶秋36 分钟前
Vue3+tyepescript+ElementPlus+Axios前端技术栈
前端·vue3·elementplus
AAA阿giao40 分钟前
HTML/CSS/JS 页面渲染机制:揭秘浏览器如何将平凡代码点化为视觉魔法
前端·css·html
lichenyang4531 小时前
从零到一:编写一个简单的 Umi 插件并发布到 npm
前端·react.js·前端框架
一颗宁檬不酸1 小时前
ajxa实例操作
前端·ajax·api
文心快码BaiduComate1 小时前
CCF程序员大会码力全开:AI加速营,10w奖金等你拿!
前端·后端·程序员
前端西瓜哥1 小时前
Figma 协同编辑是如何做用户状态同步的?
前端