我得到了一个 SVG,我必须将其添加到网页中,其中一些文本是用“Poppins”(谷歌)字体编写的。我假设 SVG 只是有关于要绘制哪个像素和哪种颜色的代码。当我使用标签添加 SVG 时<img>,它没有正确呈现。
然后我阅读了一些相关内容,了解到我需要在 SVG 中添加字体,并使用<object>标签正确渲染它。
我这样做了,现在它可以正确呈现,但我无法让它像标签一样响应<img>。我不明白我应该在哪里进行更改。
SVG: https: //www.opendemy.org/images/logo/test-logo.svg
.container {
border: 5px solid black;
width: 50%;
background: #fff;
}
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>
<body>
<div class="container">
<object data="https://www.opendemy.org/images/logo/test-logo.svg" type="image/svg+xml">
</object>
</div>
</body>
</html>
^ 在这里,我试图将 SVG 插入一个盒子中,希望它能占据盒子的 100%,但它溢出了。我也尝试稍微调整 SVG 的代码,但没有任何帮助。
这些 SVG 是使用 MS powerpoint 生成的。
慕神8447489
相关分类