CSS AdvancedLesson 78Preview gratis
CSS Media Queries
Lesson ini bagian dari CSS · Semua level
Ringkasan
Media query memungkinkan kita menerapkan aturan CSS berdasarkan kondisi perangkat, paling sering lebar layar. Dengan `@media`, gaya yang berbeda dapat aktif di ponsel, tablet, atau desktop tanpa mengubah HTML. Selain lebar, media query juga bisa memeriksa orientasi dan preferensi sistem seperti mode gelap.
Poin kunci
- Sintaks dasar: `@media (min-width: 768px) { ... }`
- `max-width` aktif untuk ukuran kecil ke bawah, `min-width` aktif dari ukuran ke atas
- Breakpoint dipilih berdasarkan di mana tata letak mulai terasa tidak nyaman
- `prefers-color-scheme` dan `orientation` adalah kondisi media lain yang berguna
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.