ElementUI el-popover弹框背景色设置

Mr-K2025-02-13 12:51

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;
}