컨테이너 끝에 그리드 요소를 배치하는 방법
<p>그리드 컨테이너가 있고 내 항목이 맨 아래에 있도록 하고 싶습니다. </p>
<p>저는 이 사실을 가지고 있습니다</p>
<p>이거 갖고 싶어요
기대</p>
<p>
<pre class="brush:css;toolbar:false;">.container {
디스플레이: 그리드;
그리드 템플릿 열: 반복(14, 1fr);
그리드 템플릿 행: 반복(6, 1fr);
그리드 간격: 8px;
너비: 200px;
배경: 파란색;
}
.안건 {
배경색: 빨간색;
색상: 흰색;
}
.item-1 {
그리드-열: 범위 5;
그리드 행: 범위 6;
}
.item-2 {
그리드-열: 범위 4;
그리드 행: 범위 5;
}
.item-3 {
그리드-열: 범위 3;
그리드 행: 범위 4;
}</pre>
<pre class="brush:html;toolbar:false;"><div class="container">
<div class="item item-1">항목 1</div>
<div class="item item-2">항목 2</div>
<div class="item item-3">항목 3
</p>
<p>PS: place-items: end 및 align-items: end;</p>