styleditor.net styleditor.net styleditor.net styleditor.net English accent-coloralignalignment-baselineallanchoranimationappearanceaspect-ratiobackdrop-filterbackface-visibilitybackgroundbaselineblock-sizeborderbottomboxbreakcaption-sidecaretclearclipcolorcolumncolumnscontaincontainercontentcornercountercursorcxcyddirectiondisplaydominant-baselinedynamic-range-limitempty-cellsfield-sizingfillfilterflexfloatfloodfontforced-color-adjustgapgridheighthyphenatehyphensimageime-modeinitial-letterinline-sizeinsetinteractivityinterestinterpolate-sizeisolationjustifyleftletter-spacinglighting-colorlinelistmarginmarkermaskmathmaxminmix-blend-modeobjectoffsetopacityorderorphansoutlineoverflowoverlayoverscrollpaddingpagepaint-orderperspectiveplacepointer-eventspositionposition-anchorposition-areaposition-tryposition-try-fallbacksposition-try-orderposition-visibilityprint-color-adjustquotesrreadingresizerightrotaterowrubyrulerxryscalescrollscrollbarshapespeakstopstroketab-sizetable-layouttexttimelinetoptouch-actiontransformtransitiontranslatetrigger-scopeunicode-bidiuser-selectvector-effectvertical-alignviewvisibilitywhitewidowswidthwill-changewordwriting-modexyz-indexzoom

מאפיין position-area

מאפיין position-area מציב אלמנט באחד מ-9 אזורי 3×3 סביב האלמנט העוגן (top, bottom, left, right, center, ושילובים). שורת קיצור עיקרית לקיבוע ביחס לעוגן ללא חישובי anchor() מורכבים.
.tooltip { position-area: top; } .popover { position: fixed; position-anchor: --field; position-area: block-end span-inline-start; }
noneאין מיקום אזורי (ברירת המחדל).topמעל העוגן.bottomמתחת לעוגן.leftמשמאל לעוגן.rightמימין לעוגן.centerמרכוז על העוגן בציר הרלוונטי.startבצד start של ציר (logical).endבצד end של ציר (logical).block-startבקצה התחלה של ציר הבלוק (logical).block-endבקצה סוף של ציר הבלוק (logical).inline-startבקצה התחלה של ציר האינליין (logical).inline-endבקצה סוף של ציר האינליין (logical).self-startמתבסס על start של האלמנט עצמו (לא של ההורה).self-endמתבסס על end של האלמנט עצמו.self-block-startblock-start ביחס לכיוון הכתיבה של האלמנט עצמו.self-block-endblock-end ביחס לכיוון הכתיבה של האלמנט עצמו.self-inline-startinline-start ביחס לכיוון הכתיבה של האלמנט עצמו.self-inline-endinline-end ביחס לכיוון הכתיבה של האלמנט עצמו.span-topפורש על אזור top (כולל הסביבה).span-bottomפורש על אזור bottom.span-leftפורש על אזור שמאל.span-rightפורש על אזור ימין.span-block-startפורש על block-start.span-block-endפורש על block-end.span-inline-startפורש על inline-start.span-inline-endפורש על inline-end.span-startפורש על start (logical).span-endפורש על end (logical).span-allפורש על כל שלושת התאים בציר.x-startבצד start של ציר X הפיזי.x-endבצד end של ציר X הפיזי.y-startבצד start של ציר Y הפיזי.y-endבצד end של ציר Y הפיזי.span-x-startפורש על אזור x-start.span-x-endפורש על אזור x-end.span-y-startפורש על אזור y-start.span-y-endפורש על אזור y-end.self-x-startx-start ביחס לכיוון האלמנט עצמו.self-x-endx-end ביחס לכיוון האלמנט עצמו.self-y-starty-start ביחס לכיוון האלמנט עצמו.self-y-endy-end ביחס לכיוון האלמנט עצמו.span-self-startפורש על אזור self-start.span-self-endפורש על אזור self-end.span-self-block-startפורש על אזור self-block-start.span-self-block-endפורש על אזור self-block-end.span-self-inline-startפורש על אזור self-inline-start.span-self-inline-endפורש על אזור self-inline-end.span-self-x-startפורש על אזור self-x-start.span-self-x-endפורש על אזור self-x-end.span-self-y-startפורש על אזור self-y-start.span-self-y-endפורש על אזור self-y-end. CSS Anchor Positioning Module Level 1 Editor's Draft W3CMDN
This can be edited. ⚓︎ Show all code ערוך CSS און-ליין התוסף שזוכר עבורך מאות פריטי CSS כל פרופרטי CSS — בהדגמה חיה מקור הייחוס הדו-לשוני ל-CSS
הגדרהדוגמאותתחבירמודולמפרטמקורות מידעהדגמה חזותית