Html 如何为引导列表组提供透明背景？

我想给一个只有上边框的列表组提供一个透明的背景。现在我得到了默认的白色背景

 <ul class="list-group">
     <li class="list-group-item">Cras justo odio</li>
     <li class="list-group-item">Dapibus ac facilisis in</li>
     <li class="list-group-item">Morbi leo risus</li>
     <li class="list-group-item">Porta ac consectetur ac</li>
     <li class="list-group-item">Vestibulum at eros</li>
 </ul>

Cras justo odio
Dapibus ac设施在
Morbi leo risus
Porta ac concetetur ac
eros的前庭

你可以试试这个，它会有用的。这很容易，也许你甚至没有尝试过

.list-group-item {
background-color: transparent;
border-top: 1px solid #ddd;
border-radius: 0;
color: #fff;
}

Cras justo odio
Dapibus ac设施处于
Morbi leo risus
Porta ac Concertetur ac
eros的前庭

---

列表组刷新将去除边框和圆角，在列表项之间只留下一条水平线，将它们彼此分开

.bg透明

将使背景透明

<ul class="list-group list-group-flush">
    <li class="list-group-item bg-transparent">Cras justo odio</li>
    <li class="list-group-item bg-transparent">Dapibus ac facilisis in</li>
    <li class="list-group-item bg-transparent">Morbi leo risus</li>
    <li class="list-group-item bg-transparent">Porta ac consectetur ac</li>
    <li class="list-group-item bg-transparent">Vestibulum at eros</li>
</ul>

Cras justo odio
Dapibus ac设施处于
Morbi leo risus
Porta ac Concertetur ac
eros的前庭

在我的情况下（最新的Chrome浏览器），它会留下一个非常糟糕的轮廓。

<ul class="list-group list-group-flush">
    <li class="list-group-item bg-transparent">Cras justo odio</li>
    <li class="list-group-item bg-transparent">Dapibus ac facilisis in</li>
    <li class="list-group-item bg-transparent">Morbi leo risus</li>
    <li class="list-group-item bg-transparent">Porta ac consectetur ac</li>
    <li class="list-group-item bg-transparent">Vestibulum at eros</li>
</ul>