Grid Eksplisit
Sistem grid menyiratkan penggunaan eksplisit dan implisit. Mari kita bahas konsep-konsep ini lebih detail.
Grid eksplisit mewakili seperangkat elemen yang ditempatkan menurut kolom dan baris. Seringkali grid eksplisit dibuat secara manual dan semua grid yang telah kita buat bersama dalam pelajaran sebelumnya adalah eksplisit (misalnya, pelajaran Ubin dalam grid).
Mari buat tabel, yang akan menjadi grid eksplisit kita:
<div id="parent">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</div>
</div>
#parent {
display: grid;
grid-template: 1fr 1fr 1fr / 1fr 1fr 1fr;
border: 2px solid #696989;
padding: 10px;
width: 400px;
height: 400px;
}
#parent > div {
padding: 10px;
border: 1px solid #696989;
}
:
