如何样式化SVG节点：在伪元素之前

我试图设计react-d3-map的标记图像样式。没有办法改变它的图像（除了图书馆代码的变化），所以我想隐藏它并使用：在伪元素之前。如何样式化SVG节点：在伪元素之前

<image class="icon-map-marker marker" 
     xmlns:xlink="http://www.w3.org/1999/xlink" 
     xlink:href="data:image/png;base64,[...]==" <!-- hardcoded in library --> 
     x="141.98888888888882" y="163.8247013673872" 
     height="25" width="25" 
</image>

但在Chrome的开发者控制台中的所有CSS定义是灰色的，当然不工作 - 在FF类似

[class*="icon-"]:before { 
    content: "0"; 
    min-width: 1em; 
    text-align: left; 
    display: inline-block; 
    font-size: 18px; 
} 
.icon-map-marker:before { 
    content: "\107F"; 
}

这个CSS的HTML元素的伟大工程。是否有可能为SVG节点创建伪元素？也许有其他一些方法来改变这个图像？

更新：我不想设置：之前在SVG元素。但是在SVG层次结构的图像节点上。

来源

2016-09-19 Neevor

@Mr_Green，我认为这是相反在这里，OP要设置'before'伪元素** **上一个SVGElement。尽管这是不可能的;-) – Kaiido

伪元素不能应用于<image>标签。规格是这样说的：

注意。本规范没有完全定义：之前和之后的替换元素（如HTML中的IMG）之间的交互。这个将在未来的规范中更详细的定义。

另见this answer

来源

2016-09-19 10:36:40

''不是IMG，但是任何svg元素都被视为替换元素。 – Kaiido

永远不要说 = 。注释是“如IMG”...... –

但是在你的引用中没有任何内容说明它适用于''也不是一般的svg元素。 – Kaiido

如何样式化SVG节点：在伪元素之前

回答

相关问题