Question

我在我的页面上的脚本上使用OpenLayers，我正在尝试使用CSS来设置地图上标准按钮的样式。我按照OpenLayers docs网站的样式设置了它们：

.olControlNavToolbar div {
  display:block;
  width:  28px;
  height: 28px;
  top: 300px;
  left: 6px;
  position: relative;
}
.olControlNavToolbar .olControlNavigationItemActive {
  background-image: url("img/panning-hand-on.png");
  background-repeat: no-repeat;
}
.olControlNavToolbar .olControlNavigationItemInactive {
  background-image: url("img/panning-hand-off.png");
  background-repeat: no-repeat;
}

但无论我在上面的代码中更改了哪些CSS设置，地图上都没有任何变化。

有没有人对我如何设置（移动/调整大小/修改）给定地图上显示的现有/默认OpenLayers按钮有任何想法？

Answer 1

自定义控件示例解释了为什么会这样，但基本上，Openlayers会动态加载CSS文件而压缩您的更改，因为它是稍后添加的。

您应该创建地图，并将'theme'选项设置为null;地图选项中的{'theme：null}。然后，在你的之前加入默认的CSS（theme / default / style.CSS），一切都应该很好。

Answer 2

查看your other question的答案。如果你没有引用'themes / default / style.css'文件，那么图像的路径是内联定义的，而不是你在上面提到的CSS类中。

OpenLayers CSS标准控制按钮样式

2 个答案: