css contain

✔️ contain CSS Style Property

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

דוגמא: הגדרת contain ללא הגבלה

Demo Panel:

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.

CSS: 111
HTML: 222
Syntax:

Valid values:
  • none, strict, content, size, inline-size, layout, style, paint, revert, revert-layer, unset, inherit, initial

Js Syntax: element.style.contain

תאימות דפדפנים

contain
הערך שנבדקChromeFirefoxEdgeCOpera
layout✔️✔️✔️✔️
none✔️✔️✔️✔️
strict✔️✔️✔️✔️
content✔️✔️✔️✔️
size✔️✔️✔️✔️
inline-size✔️✔️✔️✔️
style✔️✔️✔️✔️
paint✔️✔️✔️✔️
revert✔️✔️✔️✔️
revert-layer✔️✔️✔️✔️
unset✔️✔️✔️✔️
inherit✔️✔️✔️✔️
initial✔️✔️✔️✔️