Html 如何制作<；svg>；内联在一个段落内？

我试图在段落中内联一个SVG标记函数

标记的功能与我希望它在段落中内联的一样，而SVG声明它自己的行

这种情况会发生：

我的文字在这里

[SVG图像]

我的课文在这里继续

这就是我想要的：

我的文字在这里[SVG图像]我的文字在这里继续

此JSFIDLE显示了问题：

我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。
我在这里写一篇文章，让它继续写几行。
我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。

.文本证明{
文本对齐：对齐！重要；
}
img{
最大高度：1.5em；
}
.svg{
最大高度：1.5em；
显示：内联块；
位置：相对位置；
垂直对齐：底部对齐；
}

.text-justify{
文本对齐：对齐！重要；
}
img{
最大高度：1.5em；
}
.svg{
最大高度：1.5em；
显示：内联块；
位置：相对位置；
垂直对齐：底部对齐；
}

我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。
我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。我在这里写一篇文章，让它继续写几行。

对SVG使用

width

选项

.svg {
  width: 1.5em;
  vertical-align: middle
}

---

为svg标记添加宽度属性

.svg {
  width: 1.5em;
  vertical-align: middle
}