如何去除Leaflet缩放控件周围的灰色边框

不需要修改leaflet.css文件，在自定义CSS中添加以下代码即可消除灰色边框：

/* 移除缩放控件容器的默认灰色边框 */
.leaflet-control-zoom {
  border: none !important;
}

/* 移除按钮聚焦/点击时的灰色轮廓（可选，根据实际情况添加） */
.leaflet-control-zoom a {
  outline: none !important;
}

补充说明： #

• Leaflet的缩放控件默认被.leaflet-control-zoom容器包裹，该容器自带灰色边框样式，通过上述第一条CSS可以直接覆盖默认样式。
• 若你的缩放按钮在点击或获取焦点时出现额外灰色轮廓，添加第二条CSS即可移除。
• 你现有代码中对.leaflet-control-container的设置不作用于缩放控件的边框，因为这是所有控件的外层容器，缩放控件有独立的子容器样式。

内容的提问来源于stack exchange，提问作者MoritzMoreira