修改leaflet弹窗默认样式

1.自定义弹窗元素

//添加标记点并绑定自定义弹窗，弹窗元素可以封装为一个函数等灵活处理就行L.marker([lat, longti], {icon: geoIcon, // 设置icon,icon为自定义的图标}).addTo(this.map).bindPopup('<div>新定义的弹窗</div>')

2.修改leaflet弹窗的默认样式

//以下内容是示例，可以根据自己想更改的效果调整
//弹窗样式
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {background: url("../../../assets/pop.png") !important;width: 307px !important;height: 334px !important;background-size: 100% 100% !important;background-color: rgba(12, 9, 76, 0.4) !important;
}
// 弹窗的上一层元素
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {background-color: transparent !important;margin: 4px;color: #b0bcbb !important;box-shadow: none !important;
}
// 弹窗内容元素
.leaflet-popup-content {width: 100% !important;margin: 0 !important;
}

3.修改自定义弹窗元素样式即可