<p>พร็อพเพอร์ตี CSS ที่ช่วยสร้างเลย์เอาต์ที่ใช้งานได้ด้วยเพียงบรรทัดเดียว<br />
- จัดกึ่งกลาง! → place-items: center<br />
- แกะแพนเค้ก → flex: [grow] [shrink] [baseWidth]<br />
- ไซด์บาร์ → grid-template-columns: minmax([min],[max])<br />
- ซ้อนแพนเค้ก → grid-template-rows: auto 1fr auto <br />
- เว็บแบบคลาสสิก → grid-template: auto 1fr auto / auto 1fr auto<br />
- กริดแบบ 12 คอลัมน์ → grid-template-columns: repeat(12, 1fr)<br />
- RAM (Repeat, Auto, MinMax) → grid-template-columns: repeat(auto-fit, minmax([base], 1fr))<br />
- รักษาระยะห่างระหว่างกัน → justify-content: space-between<br />
- รักษาสไตล์ → width: clamp([min], [actual], [max])<br />
- รักษาสัดส่วน → aspect-ratio → [width] / [height]</p>
1 ความคิดเห็น