CSS Dasar / Materi 5 dari 5

Responsive Design

Menyesuaikan tampilan di berbagai layar.

Gunakan media query untuk mengubah gaya sesuai lebar layar. Mulai dari tampilan mobile dulu.

css

.grid { display: grid; gap: 12px; }
@media (min-width: 768px) {
  .grid { grid-template-columns: repeat(3, 1fr); }
}