在哪里放置<style>在SVG里面? [英] Where to put <style> inside SVG?

问题描述

对不起，如果这可能是基于意见的，但我希望有一个正确的答案..

Sorry if that might come an opinion-based, but I hope there's a right answer..

内联 CSS 样式应该放在 SVG 文档中的什么位置?在里面我在下面提供的示例中，我定义了两种样式和一个使用它们的圆.

Where an inline CSS style should be placed inside an SVG document? In the example I provide below I have defined two styles and a circle that uses them.

第一个样式在 defs 标签内定义，第二个样式在 svg 标签内定义.

The first style is defined inside defs tag and the second styles is defined right inside the svg tag.

这两种样式都成功地显示在圆圈上(至少在 Chrome 中是这样，不过没有检查其他浏览器).

Both styles are successfully displayed on the circle (at least in Chrome they do, didn't check other browsers though).

我的问题是哪种方式更标准?

My question is which way is more standard?

我认为在 defs 中保持样式可以使整个 SVG 更加​​整洁.但是，有人可以声称我不应该使用 defs 标签，因为没有人使用 <use>

I think keeping styles in defs keeps the whole SVG more tidy. However, one can claim that I should not use defs tag since no one references the style with <use>

谢谢！

<svg height="100" width="100">
    <defs id="someDefs">
        <style id="style1">
            .blue-fill {
                fill : blue;
            }
        </style>
    </defs>
    <style id="style2">
        .red-stroke {
            stroke : red;
            stroke-width : 12
        }
    </style>
    <circle cx="50" cy="50" r="40" class="blue-fill red-stroke" />
</svg>

推荐答案

没关系.这两种方法都不是更标准的".