html - 将线性梯度应用于离子列表

Question

我需要为列表应用线性渐变。我无法为整个列表做到这一点。这是一个 codepen 示例 - CODEPEN

我尝试将背景设置为红色，但它不起作用。

<ion-list style="background:red">
    <ion-item ng-repeat="item in items">{{item}}</ion-item>
</ion-list>

Answer 1

将样式应用于生成的离子类。您还需要覆盖子项目的背景颜色，使其透明，以便看到父背景。

.list {
  background: #6990E4; /* Replace with linear-gradient */
}

.list .item {
  background-color: transparent; /* To view the above background */
}

Codepen 演示