html - 对象标记内的段落

Question

我在 <object> 中嵌入了 SVG 图像标签:

<object type="image/svg+xml" data="images/quatrefoil.svg" width="100%"
  height="100%" class="svg-content"></object>

我试着放一段<p class="arvo">在 <object> 内标签，但文本不显示。我应该如何编写才能在 SVG 对象之上查看段落文本？

Answer 1

使用共享父级

<div class="container">
    <svg ...>
    <p class="description">...</p>
</div>

连同

.container {
    position: relative;
    width: {x}px;
    height: {x}px;
}

.container svg {
    position: relative;
    width: 100%; height: 100%;
    z-index: 1;
}

.container .description {
    position: absolute;
    bottom: 0px;
    width: 100%;
    z-index: 999; /* or something sufficiently large */
}