Css 使用react组件（Map）作为背景图像？

我有一个react组件，它生成一个静态映射。我想使用该地图作为包含一些文本的引导卡的背景

我尝试过使用overlay、z-index和其他CSS工具，但不管我怎么做，地图似乎完全覆盖了卡片的所有内容。是否可以以这种方式使用react组件

请参见下面的相关代码片段。我知道“card img”引导类不适用于传单映射组件，因为它不是一个图像，这只是为了说明我要做的事情

JSX:

---

谢谢。

这应该是可能的。很难说这么少的代码有什么问题，但让我猜猜：您是否在

组件上设置了

位置：relative

？为了使其正常工作，

组件不能是

位置：静态的

，这通常是默认的，或者。

因此我发现了问题，传单库在其地图上生成了一个名为“传单容器”的类，其z索引为400。我用了一句话就把它盖过了！很重要，问题解决了。

谢谢，伙计，很高兴知道以后会怎样。选中此选项可能是问题的一部分，但主要问题是库生成的类的z索引为400！干杯

<div className="card rounded my-3 shadow-lg current-card">
    <div className="card-top text-center">
        <div className="day-date my-3">
            <p>Saturday, March 15th</p>
            <span>...</span>
        </div>
    <LeafletMap className="card-img-top" />
</div>

.day-date{
    position:absolute;
    width:100%;
    z-index:3;
}