css מאפייני align align-self

תפריט ראשי

מבוא ל-CSSצבעים ב-CSSפונקציות CSSמחולל דוגמאות CSSטיפים וטריקים ב CSSאודות אתר סי.אס.אס. גייד

מאפייני CSS

accent-coloralignalign-contentalign-itemsalign-selfanimationappearanceaspect-ratiobackgroundblock-sizeborderbottomboxcaption-sidecaret-colorclearcolorcolumncolumnscornercursordirectiondisplayempty-cellsflexfloatfontgapgridheightinline-sizeinsetjustifyleftletter-spacingline-heightlistmarginmaxminmix-blend-modeobjectopacityoutlineoverflowpaddingperspectivepointer-eventsresizerightrotaterow-gapscalescrollbartab-sizetable-layouttexttoptransform-origintranslateunicode-bidiuser-selectvertical-alignvisibilitywhite-spacewidthwordwriting-modez-index

✔️ align-self CSS Style Property

המאפיין align-self מגדיר את היישור בכיוון השורה עבור הפריט שנבחר בתוך מיכל flexbox או grid (תגיות עם display: flex; או display: grid;)

הגרה של מאפיין זה לכל התגיות הבנים שווה ערך להגדרה של המאפיין align-items להורה

דוגמא: שימוש במאפיין align-self במיכל flexbox

Demo Panel:
האתר
cssguide
הוא האתר הכי טוב
CSS:
HTML:
Syntax:

align-self: auto | stretch | center | flex-start | flex-end | baseline | initial | inherit;

Valid values:
  • auto, normal, flex-start, flex-end, center, baseline, stretch, first baseline, last baseline, start, end, self-start, self-end, anchor-center, revert, revert-layer, unset, inherit, initial

Js Syntax: element.style.alignSelf

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

align-self
הערך שנבדקChromeFirefoxEdgeCOpera
auto✔️✔️✔️✔️
normal✔️✔️✔️✔️
flex-start✔️✔️✔️✔️
flex-end✔️✔️✔️✔️
center✔️✔️✔️✔️
baseline✔️✔️✔️✔️
stretch✔️✔️✔️✔️
revert✔️✔️✔️✔️
revert-layer✔️✔️✔️✔️
unset✔️✔️✔️✔️
inherit✔️✔️✔️✔️
initial✔️✔️✔️✔️

דוגמא: שימוש במאפיין align-self במיכל flexbox בכיוון של עמודות

Demo Panel:
האתר
cssguide
הוא האתר הכי טוב
CSS:
HTML:

דוגמא: שימוש במאפיין align-self במיכל רשת

Demo Panel:
האתר
cssguide
הוא האתר הכי טוב
CSS:
HTML:
אודות | הצהרת פרטיות | צור קשר