โครงสร้าง media query
รูปแบบพื้นฐาน
/* เงื่อนไขความกว้างขั้นต่ำ */
@media (min-width: 640px) {
body { font-size: 1.05rem; }
}
/* หลายเงื่อนไข */
@media (min-width: 768px) and (orientation: landscape) {
.sidebar { display: block; }
}
สิ่งที่มักเปลี่ยนใน @media
จำนวนคอลัมน์กริด · ซ่อน/แสดงเมนู · ขนาดตัวอักษร · ระยะ padding ของหน้า