使用element的提示框并修改css

使用el-tooltip来做提示框:

html 复制代码
<el-tooltip popper-class="popper" content="敬请期待" placement="right">
    <div>
        <i class="iconfont icon-lianjie-01"></i>
        <span>输入链接</span>
    </div>
</el-tooltip>

去掉默认小三角和背景样式:

css 复制代码
.popper {
    width: 268.5px !important;
    background: #F0F0F0 !important;
    font-weight: 400 !important;
    font-size: 12px !important;
    color: #333333 !important;
    padding: 14px 22px !important;
    border: 1px solid #E8E8E8 !important;
}

.popper .popper__arrow::after, 
.popper .popper__arrow {
    border-right-color: #F0F0F0 !important;
}
相关推荐
咩咩啃树皮10 分钟前
第40篇:Vue3组件化开发精讲——组件拆分、复用、父子通信、工程化架构
java·前端·架构
阳光是sunny12 分钟前
LangGraph中的Reducer是什么
前端·人工智能·后端
触底反弹15 分钟前
一文搞懂 Tailwind CSS 弹性布局:从原理到实战
前端·css·html
阳光是sunny32 分钟前
从链到图:LangGraph 入门基础全解析
前端·人工智能·后端
小林ixn1 小时前
从 ??= 到 onKeyDown:一个 React 组件的“自我修养”
前端·javascript·react.js
REDcker2 小时前
显示分辨率标准对照详解
前端·网络·分辨率·显示·屏幕
এ慕ོ冬℘゜2 小时前
前端实战:jQuery 多条件联合搜索(标题模糊查询 + 日历时间段筛选)
前端·javascript·jquery
武子康2 小时前
Search Console Platform Properties 扩大 SEO 资产边界:从 Page Ranking 到 Topic Coverage(5 类误读边界 + 3 表数据层设计)
前端·人工智能·后端
一点一木3 小时前
从60首歌到1个网站:输入你的故事,还你一首歌
前端·github
IT_陈寒4 小时前
Vue这个特性差点让我加班到凌晨,谁懂啊
前端·人工智能·后端