- 정보공유
[퍼블리싱] CSS를 사용하여 4x4 형태의 갤러리 디자인 그리드
<style>
.gallery {display: grid;grid-template-columns: repeat(4, 1fr);gap: 10px;}
.gallery-item {background-color: #ddd;padding: 20px;text-align: center;}
</style>
<div class="gallery">
<div class="gallery-item">1</div>
<div class="gallery-item">2</div>
<div class="gallery-item">3</div>
<div class="gallery-item">4</div>
<div class="gallery-item">5</div>
<div class="gallery-item">6</div>
<div class="gallery-item">7</div>
<div class="gallery-item">8</div>
<div class="gallery-item">9</div>
<div class="gallery-item">10</div>
<div class="gallery-item">11</div>
<div class="gallery-item">12</div>
<div class="gallery-item">13</div>
<div class="gallery-item">14</div>
<div class="gallery-item">15</div>
<div class="gallery-item">16</div>
</div>