css - 如何在 svg sprite 中填充或描边 sv​​g 元素。

Question

我在查看选取的元素并将颜色应用于选取的元素时遇到问题。

例如 我有一个名为 untitled.svg 的图像 Sprite ，其中列出了图标集合。我想选择日历。我可以选择元素，但无法查看或设置所选元素日历的样式。我可以看到正在呈现的路径，但无法设置输出样式。

日历代码示例

<symbol id="calendar" x="160" y="0" class="st1" width="100%" height="100%" stroke="blue" style="
">
    <title>calendar</title>

<path class="st0" d="M181.3,23.3h-10.8c-0.6,0-1.1-0.5-1.1-1.1V11.5c0-0.6,0.5-1.1,1.1-1.1h10.7c0.6,0,1.1,0.5,1.1,1.1v10.7  C182.3,22.9,181.9,23.3,181.3,23.3z M170.5,11.2c-0.2,0-0.4,0.1-0.4,0.4v10.7c0,0.2,0.1,0.4,0.4,0.4h10.7c0.2,0,0.4-0.1,0.4-0.4  V11.5c0-0.2-0.1-0.4-0.4-0.4C181.3,11.2,170.5,11.2,170.5,11.2z"/>
<path class="st0" d="M172.3,8.8h0.7v1.8h-0.7V8.8z"/>
<path class="st0" d="M178.8,8.8h0.7v1.8h-0.7V8.8z"/>
<path class="st0" d="M175.9,14.6c-0.8,0-1.4-0.6-1.4-1.4c0-0.8,0.6-1.4,1.4-1.4s1.4,0.6,1.4,1.4C177.3,13.9,176.7,14.6,175.9,14.6z   M175.9,12.4c-0.4,0-0.7,0.3-0.7,0.7s0.3,0.7,0.7,0.7s0.7-0.3,0.7-0.7S176.3,12.4,175.9,12.4z"/>
<path class="st0" d="M179.5,14.6c-0.8,0-1.4-0.6-1.4-1.4c0-0.8,0.6-1.4,1.4-1.4c0.8,0,1.4,0.6,1.4,1.4  C180.9,13.9,180.3,14.6,179.5,14.6z M179.5,12.4c-0.4,0-0.7,0.3-0.7,0.7s0.3,0.7,0.7,0.7c0.4,0,0.7-0.3,0.7-0.7  S179.9,12.4,179.5,12.4z"/>
<path class="st0" d="M172.3,18.1c-0.8,0-1.4-0.6-1.4-1.4c0-0.8,0.6-1.4,1.4-1.4c0.8,0,1.4,0.6,1.4,1.4  C173.8,17.5,173.1,18.1,172.3,18.1z M172.3,16c-0.4,0-0.7,0.3-0.7,0.7c0,0.4,0.3,0.7,0.7,0.7c0.4,0,0.7-0.3,0.7-0.7  S172.7,16,172.3,16z"/>
<path class="st0" d="M175.9,18.1c-0.8,0-1.4-0.6-1.4-1.4c0-0.8,0.6-1.4,1.4-1.4s1.4,0.6,1.4,1.4S176.7,18.1,175.9,18.1z M175.9,16  c-0.4,0-0.7,0.3-0.7,0.7c0,0.4,0.3,0.7,0.7,0.7s0.7-0.3,0.7-0.7S176.3,16,175.9,16z"/>
<path class="st0" d="M179.5,18.1c-0.8,0-1.4-0.6-1.4-1.4c0-0.8,0.6-1.4,1.4-1.4c0.8,0,1.4,0.6,1.4,1.4S180.3,18.1,179.5,18.1z   M179.5,16c-0.4,0-0.7,0.3-0.7,0.7c0,0.4,0.3,0.7,0.7,0.7c0.4,0,0.7-0.3,0.7-0.7S179.9,16,179.5,16z"/>
<path class="st0" d="M172.3,21.7c-0.8,0-1.4-0.6-1.4-1.4s0.6-1.4,1.4-1.4c0.8,0,1.4,0.6,1.4,1.4S173.1,21.7,172.3,21.7z M172.3,19.6  c-0.4,0-0.7,0.3-0.7,0.7s0.3,0.7,0.7,0.7c0.4,0,0.7-0.3,0.7-0.7S172.7,19.6,172.3,19.6z"/>
<path class="st0" d="M175.9,21.7c-0.8,0-1.4-0.6-1.4-1.4s0.6-1.4,1.4-1.4s1.4,0.6,1.4,1.4S176.7,21.7,175.9,21.7z M175.9,19.6  c-0.4,0-0.7,0.3-0.7,0.7s0.3,0.7,0.7,0.7s0.7-0.3,0.7-0.7S176.3,19.6,175.9,19.6z"/>

</symbol> 

我错过了什么。我刚开始使用 svgs indepth。

Answer 1

Symbol 不要使用标签。请改用 svg 标签这样您就可以在屏幕上看到您的绘图。