מאפיין contain

מאפיין contain מאפשר למחבר להגביל את הצמתים הצאצאים של אלמנט כך שהדפדפן יוכל לבצע אופטימיזציות של פריסה, ציור וסגנון על-ידי הנחה שהאלמנט מנותק משאר העץ. מאיץ עיבוד של עמודים גדולים.

.card { contain: content; }

.widget { contain: layout paint style; }

noneהאלמנט מתעבד כרגיל, ללא אפקטי הכלה (ברירת המחדל).

strictמחושב כ-size layout paint style — מפעיל את כל סוגי ההכלה.

contentמחושב כ-layout paint style — מפעיל את כל סוגי ההכלה למעט size containment.

sizeהכלת גודל: מבטיח שתיבת ההכלה יכולה להיפרס מבלי שיהיה צורך לבדוק את צאצאיה.

inline-sizeהכלת גודל ציר ה-inline בלבד: ה-inline-size של תיבת האב לא מסתמך ישירות על תוכנו.

layoutהכלת פריסה: תיבת ההכלה אטומה לחלוטין למטרות פריסה.

styleהכלת סגנון: אפקטים של מאפיינים מסוימים לא חורגים מחוץ לאלמנט (לדוגמה counters).

paintהכלת ציור: צאצאי האלמנט לא מוצגים מחוץ לגבולותיו (כמו overflow: hidden לוויזואל).

CSS Containment Module Level 2

Editor's Draft

W3C MDN

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Show all code

ערוך CSS און-ליין

התוסף שזוכר עבורך מאות פריטי CSS

כל פרופרטי CSS — בהדגמה חיה

מקור הייחוס הדו-לשוני ל-CSS

previous next