1. 程式人生 > 其它 >element-ui 自定義el-popover彈出框的樣式,以及彈出框的位置(相對於自身來說)

element-ui 自定義el-popover彈出框的樣式,以及彈出框的位置(相對於自身來說)

原來的樣式

在這裡插入圖片描述

自定義樣式以後的彈出框

在這裡插入圖片描述

popper-class=“area_popper” 給彈出框新增類名,設定自定義樣式

.area_popper{
    background-color: #3d4451!important;
    border-radius: 6px!important;
    opacity: 0.9!important;
    font-size: 12px!important;
    color: #ffffff!important; 
    padding: 0!important;
    transform: translateY(12px);
}
.showText{ margin: 8px; } .popper__arrow::after{ border-top-color: #3d4451!important; }

樣式要寫到全域性樣式表中
自定義彈出的位置,要用到 transform平移和子自身的一個偏移量屬性offset結合使用,達到預期效果;之前一直在考慮用定位,一直沒有成功