คุณสมบัติ CSS object-fit ปรับขนาด元素ให้พอดีกับความกว้าง/สูงของคอนเทนเนอร์ มักใช้กับ background images
มี 5 ค่าสำหรับ object-fit (ใช้ภาพประกอบ):
contain: รักษาอัตราส่วน ภาพทั้งหมดมองเห็นได้ อาจมีแถบว่าง (letterboxing) ด้านบน/ล่างหรือซ้าย/ขวาcover: รักษาอัตราส่วน แต่เติมเต็มคอนเทนเนอร์ — ภาพอาจถูกตัด (clipped) หากอัตราส่วนไม่ตรงfill: ยืด/อัดภาพให้เต็มคอนเทนเนอร์ ไม่สนอัตราส่วน — ภาพอาจบิดเบี้ยวnone: ภาพรักษาขนาดต้นฉบับ ไม่ปรับขนาดscale-down: เลือกnoneหรือcontainใดก็ตามที่ทำให้ภาพเล็กกว่า — ในตัวอย่างเลือกcontain
รองรับเบราว์เซอร์กว้าง ตรวจสอบเพิ่มเติมสำหรับ IE, Edge, Opera เก่า
สรุป
object-fit ใช้กับ元素ที่แทรกได้ (replaced elements เช่น <img>) ควบคุมการเติมคอนเทนเนอร์ ใช้ร่วมกับ object-position เพื่อจัดตำแหน่งการแสดงผล
