Bootstarp 4-网格系统-固定项目在灵活的盒子

Question

中等大小，向上直到大屏幕第二个图像的高度不等于其他图像[在此输入图像描述][1]

https://i.stack.imgur.com/Qcytg.png

<div class="container">
<div class="row "> 
<% campgrounds.forEach(function(campground){ %>
<div class="col-sm text-center d-flex align-items-strech">
<div class="card">
<img class="card-img-top" src="<%=campground.image%>" alt="Card image cap">
<div class="card-body">
<h3 class="card-title"><%=campground.name%></h3>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p> 
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
</div>
<% }); %>
</div>
</div>

Answer 1

您可以将align self-end类添加到该按钮中，使其在底部对齐。