标准控制按钮的OpenLayers CSS样式

Question

我在我的页面上的脚本上使用OpenLayers，我正试图使用CSS来样式化地图上的标准按钮。我遵循OpenLayers文档网站的样式，像这样:

.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之前包含默认的CSS (theme/default/style.CSS)，一切都会很好。

Answer 2

看你的另一个问题的答案。如果你没有引用'themes/default/style.css'文件，路径到图像是内联定义的，而不是在CSS类你上面提到的。