ElementUI el-popover弹框背景色设置

1.el-popover样式由于使用了 absolute 属性,导致脱离了节点,所以在父级元素使用class无法进行权重处理来修改其样式,解决方式如下:通过popper-class实现样式处理,避免全局样式污染

javascript 复制代码
// html
<el-popover
      placement="right"
      popper-class="device-popover"
      width="130"
      trigger="click">
          <div>
               Devices with the same IP address as the user
          </div>
</el-popover>

//css 
.device-popover{
   background-color: #ffdf25 !important;
   border-color: #ffdf25 !important;
}
.device-popover .popper__arrow::after{
   border-right-color:#ffdf25 !important;
}
相关推荐
鱼人几秒前
Vue 3 组合式 API 最佳实践:如何写出可维护的代码
前端
wuhen_n几秒前
LangChain 自定义 Tool 封装:打造专属 AI 能力工具集
前端·langchain·ai编程
长大19881 分钟前
彻底搞懂 JavaScript 事件循环
前端
橘猫走江湖2 分钟前
Web 前端本地存储:localStorage 与 IndexedDB
前端·javascript·indexeddb
小强19882 分钟前
CSS 布局进化史:从 Float 到 Flexbox 再到 Grid
前端
AKA__老方丈5 分钟前
删除确认 Hook - 统一管理单删/批量删除的确认弹窗与执行
前端·javascript·vue.js
假如让我当三天老蒯8 分钟前
React+TS 项目结构(自学项目用)
前端·react.js
yingyima9 分钟前
Celery 分布式任务队列:我差点被这行代码坑死
前端
用户1257585243610 分钟前
XYGo Admin 即时通讯模块解析:基于 WebSocket 的企业级消息架构实践
前端
铁皮饭盒13 分钟前
彩色命令行,Node21自带函数1行实现 ,Bun也兼容, 附Bun.color实现渐变色的代码
前端·后端