vue中el-tooptip 气泡小箭头样式修改

如图,根据要求设置了气泡的背景颜色和边框；

.el-tooltip__popper.is-dark {
  background: rgb(0, 13, 53) ;
  border: 1px solid #1e88c6;
}

小箭头不能跟气泡融合,显得很生硬,修改原理就是修改气泡框下方有两个三角的颜色，一个压在另一个三角上方，稍稍漏出一点作为边框

.el-tooltip__popper.is-dark[x-placement^="top"] .popper__arrow{
    bottom: -9px ;   
    border-top-color: #1e88c6 ;  //颜色与气泡边框一致，作为小箭头的边框
    border-top-width: 8px ;  
}

.el-tooltip__popper.is-dark[x-placement^="top"] .popper__arrow::after{
    bottom: 1px;  
    border-top-color: rgba(0, 13, 53, 1) ; //颜色与气泡背景一致，作为小箭头的背景颜色
    border-top-width: 8px;  //小箭头的大小
}

完美解决了

需要注意的是，这些样式添加scoped 就不生效了！！！