通过 CSS 设计 SOS 点功能

Question

我通过传感器对象服务 (SOS) 接收点要素。他们的风格还没有在任何 style.css 中定义。如果我将鼠标悬停在特征上并检查 Firebug 中的一个特征元素，它会显示为一个标签，其 ID 类似于 "OpenLayers.Geometry.Point_112"。我可以在 Firebug 中内联更改填充颜色，但如果我在 css 文件中为该 ID 定义样式，它不会做出反应。颜色不变。

#OpenLayers.Geometry.Point_112{
    fill: olive !important;
}

有什么想法吗？

Answer 1

这是因为，在CSS中，点（.）代表类。因此，当您放置#OpenLayers.Geometry.Point_112 时，CSS 将查找具有 ID #OpenLayers 和类 .Geometry 和 .Point_112 的元素。

像这样：

<element id="OpenLayers" class="Geometry Point_112"></element>

要解决此问题，您需要在 CSS:

中使用转义字符 (\)

#OpenLayers\.Geometry\.Point_112{
  display:block;
  background-color: olive;
}

<div id="OpenLayers.Geometry.Point_112">hey</div>

更多详情：backslash (\) escaping

通过 CSS 设计 SOS 点功能

Style SOS point feature via CSS

css

css-selectors

openlayers