如何在 javaFX FXML 中使用 CSS 设置 SVG 样式答案

【问题标题】：How to style a SVG using CSS in javaFX FXML如何在 javaFX FXML 中使用 CSS 设置 SVG 样式
【发布时间】：2016-02-24 14:09:47
【问题描述】：

我将 SVG 用于按钮中的图像。但我无法通过 CSS 为它填充颜色。下面是渲染按钮的代码。

<Button  onAction="#closeApplication" >
<graphic>
 <SVGPath content="M10,16 10,0 0,8z" styleClass="button‐icon‐shape" />
</graphic>
</Button>

这是css

.button-icon-shape SVGPath{
   -fx-fill:  red;
}

【问题讨论】：

标签： css svg javafx-8 fxml

【解决方案1】：

这是它的工作原理。我必须为按钮设置样式并使用该类来设置按钮中的 svg 样式。

<Button  onAction="#closeApplication" styleClass="closeButton">
        <graphic>
            <SVGPath content="M10,16 10,0 0,8z"  />
        </graphic>
</Button>

这是css

.closeButton{

}
.closeButton SVGPath{
   -fx-fill:  red;
}

【讨论】：

【解决方案2】：

我知道这是一个老问题，但这个 OP 解决方案在我看来并不是最好的。如果你遇到同样的问题，我的建议是阅读JavaFX CSS Reference Guide (JFX 8)，尤其是重定向到这个selectors link。

这里使用初始代码最简单的解决方案如下：

<Button onAction="#closeApplication">
    <graphic>
        <SVGPath content="M10,16 10,0 0,8z" styleClass="button-icon-shape" />
    </graphic>
</Button>