⭕ align-content CSS Style Property

המאפיין align-content רלוונטי לתגיות שמוגדרות עם display: flex;, display: grid; או display: block;
מאפיין זה מגדיר את עימוד המידע וחילוק הרווחים בין ומסביב לבנים של התגית.

דוגמא: שינוי המיקומים בתוך flex

Demo Panel:

CSS
Guide dot net container

CSS:

HTML:

Syntax:

Valid values:

normal, baseline, first baseline, space-between, space-around, space-evenly, stretch, center, start, end, flex-start, flex-end, revert, revert-layer, unset, initial, inherit

Js Syntax: element.style.alignContent

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

align-content
הערך שנבדק	Chrome	Firefox	EdgeC	Opera
center	✔️	✔️	✔️	✔️
normal	✔️	✔️	✔️	✔️
baseline	✔️	✔️	✔️	✔️
first baseline	✔️	✔️	✔️	✔️
space-between	✔️	✔️	✔️	✔️
space-around	✔️	✔️	✔️	✔️
space-evenly	✔️	✔️	✔️	✔️
stretch	✔️	✔️	✔️	✔️
start	✔️	✔️	✔️	✔️
end	✔️	✔️	✔️	✔️
flex-start	✔️	✔️	✔️	✔️
flex-end	✔️	✔️	✔️	✔️
revert	✔️	✔️	✔️	✔️
revert-layer	✔️	✔️	✔️	✔️
unset	✔️	✔️	✔️	✔️
initial	✔️	✔️	✔️	✔️
inherit	✔️	✔️	✔️	✔️
last baseline	❌	✔️	❌	❌
unsafe	❌	❌	❌	❌
safe	❌	❌	❌	❌

דוגמא: שינוי המיקומים בתוך grid

Demo Panel:

CSS
Guide dot net container

CSS:

HTML:

דוגמא: שינוי המיקומים בתוך block

Demo Panel:

CSS
Guide dot net container

CSS:

HTML:

דוגמא: שינוי המיקומים בתוך flex עם כיוון הפריטים

Demo Panel:

CSS
Guide dot net container

CSS:

HTML:

תפריט ראשי

מאפייני CSS

⭕ align-content CSS Style Property

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