/* 修改tooltip的right弹出的箭头 有两层一个是:after
设置颜色需要将其中一个transparent设置透明掉,不然重叠在一起颜色不对
其他位置则把right改成自己选择弹出的位置
*/
.tipclass[x-placement^="top"] .popper__arrow {
border-top-color: #28B3F9 !important;
}
.tipclass[x-placement^="top"] .popper__arrow:after {
border-top-color:#28B3F9 !important;
}
.tipclass-buttom[x-placement^="top"] .popper__arrow {
border-top-color: #28B3F9 !important;
}
.tipclass-buttom[x-placement^="top"] .popper__arrow:after {
border-top-color:#28B3F9 !important;
}
.tipclass{
background: linear-gradient(180deg, rgba(19,64,115,0.93) 0%, rgba(8,30,63,0.93) 100%) !important;
box-shadow: 0px 2px 14px 2px #082A52;
border-radius: 2px;
border: 1px solid;
border-image: linear-gradient(180deg, rgba(28, 183, 255, 1), rgba(12, 129, 255, 1)) 1 1;
backdrop-filter: blur(10px);
}
.tipclass-buttom{
background: linear-gradient(180deg, rgba(19,64,115,0.93) 0%, rgba(8,30,63,0.93) 100%) !important;
box-shadow: 0px 2px 14px 2px #082A52;
border-radius: 2px;
border: 1px solid;
border-image: linear-gradient(180deg, rgba(28, 183, 255, 1), rgba(12, 129, 255, 1)) 1 1;
backdrop-filter: blur(10px);
color: #FFFFFF;
}
自定义el-tooltip背景和小三角的颜色
最新推荐文章于 2024-03-05 11:28:22 发布