您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

如何使用CSS设置外部SVG样式

如何使用CSS设置外部SVG样式

如果像引用object标签一样通过引用外部文件来包含svg图像,则svg图像中的元素将不包含在主文档DOM树中。他们组成了自己的树。因此,外部图像中的元素无法通过主文档中的CSS选择器进行匹配。

您可以object像大多数其他元素一样设置元素的样式,例如为其设置边框。但是您不能(至少这样)访问外部图像中的元素。在你的情况,你尝试风格#obcolor。这将适用于objects的文本颜色,而不适用于引用的svg图像内的任何颜色。在不支持svg的浏览器上,“您的浏览器不支持SVG”通知可能会显示为蓝色。

您的CSS选择器的情况与此svg类似:主文档中的CSS选择器仅与主文档中的元素匹配,没有svg找到,只是一个object

有一些方法可以将CSS样式应用于svg元素。通常,此想法是通过从外部文件到主文档的svg元素或从主文档到外部文件的CSS,将CSS和svg元素置于同一DOM树中:

CSS 2022/1/1 18:23:05 有332人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶