图像未与 materialize css 卡正确对齐

Question

我正在使用 materialize css 在卡片中放置图像

但图像似乎被剪掉了一半

<div class="card teal lighten-3 large hoverable">
    <div class="card-image">
        <img id="axolotl-api-picture" style="background-size: 100% 100%;" alt="cute axolotl">
    </div>
    <div class="card-action teal">
        <a class="prev axolotl-api-picture">Previous</a>
        <a class="next axolotl-api-picture">Next</a>
    </div>
</div>

当前图像： img

原始图像（即我想要的）： img

所以你看到图像没有完全显示

Answer 1

试试这个：

style="background-size: cover;"

此外，我认为您需要更改此 div <div class="card-image"> 的高度。图像占用了可用的整个空间。