CSS-Eigenschaften
Eine CSS Eigenschaft ist ein Parameter, der in einer CSS-Deklaration verwendet wird und es Ihnen ermöglicht, bestimmte Aspekte der ausgewählten Elemente zu gestalten. Zum Beispiel wird die opacity-Eigenschaft verwendet, um die Transparenz eines ausgewählten Elements festzulegen, sodass Sie steuern können, ob der Inhalt hinter diesem Element sichtbar ist:
/* Set 0.8 opacity on <img> elements */
img {
opacity: 0.8;
}
Jede Eigenschaft hat einen Namen (z.B. opacity), einen Wert (z.B. 0.8) und ein definiertes Verhalten bei der Darstellung des Dokuments. CSS definiert auch Kurzschreibweisen für Eigenschaften, sodass Sie mehrere verwandte Eigenschaften in einer einzigen Deklaration angeben können. Zum Beispiel ist die margin-Eigenschaft eine Kurzschreibweise für margin-top, margin-right, margin-bottom und margin-left, wodurch der Rand aller vier Seiten eines Elements festgelegt wird:
/* Give <img> elements 1rem of margin */
img {
margin: 1rem;
}
Syntax
selector {
property: value;
}
Alphabetisches Verzeichnis der Eigenschaften
Von den CSS-Spezifikationen definierte Standardeigenschaften umfassen unter anderem:
Verschiedenes
A
accent-coloralign-contentalign-itemsalign-selfalignment-baselineall(Kurzschreibweise)anchor-nameanchor-scopeanimation-compositionanimation-delayanimation-directionanimation-durationanimation-fill-modeanimation-iteration-countanimation-nameanimation-play-stateanimation-range-endanimation-range-startanimation-range(Kurzschreibweise)animation-timelineanimation-timing-functionanimation(Kurzschreibweise)appearanceaspect-ratio
B
backdrop-filterbackface-visibilitybackground-attachmentbackground-blend-modebackground-clipbackground-colorbackground-imagebackground-originbackground-position-xbackground-position-ybackground-positionbackground-repeat(Kurzschreibweise)background-repeat-xbackground-repeat-ybackground-sizebackground(Kurzschreibweise)baseline-shiftbaseline-sourceblock-size
Border-*
border-block-colorborder-block-end-colorborder-block-end-styleborder-block-end-widthborder-block-end(Kurzschreibweise)border-block-start-colorborder-block-start-styleborder-block-start-widthborder-block-start(Kurzschreibweise)border-block-styleborder-block-widthborder-block(Kurzschreibweise)border-bottom-colorborder-bottom-left-radiusborder-bottom-right-radiusborder-bottom-styleborder-bottom-widthborder-bottom(Kurzschreibweise)border-collapseborder-color(Kurzschreibweise)border-end-end-radiusborder-end-start-radiusborder-image-outsetborder-image-repeatborder-image-sliceborder-image-sourceborder-image-widthborder-image(Kurzschreibweise)border-inline-colorborder-inline-end-colorborder-inline-end-styleborder-inline-end-widthborder-inline-end(Kurzschreibweise)border-inline-start-colorborder-inline-start-styleborder-inline-start-widthborder-inline-start(Kurzschreibweise)border-inline-styleborder-inline-widthborder-inline(Kurzschreibweise)border-left-colorborder-left-styleborder-left-widthborder-left(Kurzschreibweise)border-radius(Kurzschreibweise)border-right-colorborder-right-styleborder-right-widthborder-right(Kurzschreibweise)border-spacingborder-start-end-radiusborder-start-start-radiusborder-style(Kurzschreibweise)border-top-colorborder-top-left-radiusborder-top-right-radiusborder-top-styleborder-top-widthborder-top(Kurzschreibweise)border-width(Kurzschreibweise)border(Kurzschreibweise)
B - C
bottombox-alignbox-decoration-breakbox-directionbox-flex-groupbox-flexbox-linesbox-ordinal-groupbox-orientbox-packbox-shadowbox-sizingbreak-afterbreak-beforebreak-insidecaption-sidecaret-animationcaret-colorcaret-shapecaret(Kurzschreibweise)clearclip-pathclip-ruleclipcolor-interpolation-filterscolor-interpolationcolor-schemecolorcolumn-countcolumn-fillcolumn-gapcolumn-heightcolumn-rule-colorcolumn-rule-stylecolumn-rule-widthcolumn-rule(Kurzschreibweise)column-spancolumn-widthcolumn-wrapcolumns(Kurzschreibweise)contain-intrinsic-block-sizecontain-intrinsic-heightcontain-intrinsic-inline-sizecontain-intrinsic-size(Kurzschreibweise)contain-intrinsic-widthcontaincontainer-namecontainer-typecontainer(Kurzschreibweise)content-visibilitycontentcorner-block-end-shapecorner-block-start-shapecorner-bottom-left-shapecorner-bottom-right-shapecorner-bottom-shape(Kurzschreibweise)corner-end-end-shapecorner-end-start-shapecorner-inline-end-shapecorner-inline-start-shapecorner-left-shape(Kurzschreibweise)corner-right-shape(Kurzschreibweise)corner-shape(Kurzschreibweise)corner-start-end-shapecorner-start-start-shapecorner-top-left-shapecorner-top-right-shapecorner-top-shape(Kurzschreibweise)counter-incrementcounter-resetcounter-setcursorcxcy
D - F
ddirectiondisplaydominant-baselinedynamic-range-limitempty-cellsfield-sizingfill-opacityfill-rulefillfilterflex-basisflex-directionflex-flow(Kurzschreibweise)flex-growflex-shrinkflex-wrapflex(Kurzschreibweise)floatflood-colorflood-opacityfont-familyfont-feature-settingsfont-kerningfont-language-overridefont-optical-sizingfont-palettefont-size-adjustfont-sizefont-smoothfont-stretchfont-stylefont-synthesis-positionfont-synthesis-small-capsfont-synthesis-stylefont-synthesis-weightfont-synthesis(Kurzschreibweise)font-variant-alternatesfont-variant-capsfont-variant-east-asianfont-variant-emojifont-variant-ligaturesfont-variant-numericfont-variant-positionfont-variant(Kurzschreibweise)font-variation-settingsfont-weightfont-widthfont(Kurzschreibweise)forced-color-adjust
G - I
gap(Kurzschreibweise)grid-area(Kurzschreibweise)grid-auto-columnsgrid-auto-flowgrid-auto-rowsgrid-column-endgrid-column-startgrid-column(Kurzschreibweise)grid-row-endgrid-row-startgrid-row(Kurzschreibweise)grid-template-areasgrid-template-columnsgrid-template-rowsgrid-template(Kurzschreibweise)grid(Kurzschreibweise)hanging-punctuationheighthyphenate-characterhyphenate-limit-charshyphensimage-orientationimage-renderingimage-resolutioninitial-letterinline-sizeinset-block-endinset-block-startinset-block(Kurzschreibweise)inset-block(Kurzschreibweise)inset-inline-endinset-inline-startinset-inline(Kurzschreibweise)inset-inline(Kurzschreibweise)inset(Kurzschreibweise)inset(Kurzschreibweise)interactivityinterest-delayinterest-delay-endinterest-delay-startinterpolate-sizeisolation
J - M
justify-contentjustify-itemsjustify-selfleftletter-spacinglighting-colorline-breakline-clampline-height-stepline-heightlist-style-imagelist-style-positionlist-style-typelist-style(Kurzschreibweise)list-style(Kurzschreibweise)margin-block-endmargin-block-startmargin-block(Kurzschreibweise)margin-bottommargin-inline-endmargin-inline-startmargin-inline(Kurzschreibweise)margin-leftmargin-rightmargin-topmargin-trimmargin(Kurzschreibweise)marker-endmarker-midmarker-startmarkermask-border-modemask-border-outsetmask-border-repeatmask-border-slicemask-border-sourcemask-border-widthmask-border(Kurzschreibweise)mask-clipmask-compositemask-imagemask-modemask-originmask-positionmask-repeatmask-sizemask-typemask(Kurzschreibweise)math-depthmath-shiftmath-stylemax-block-sizemax-heightmax-inline-sizemax-widthmin-block-sizemin-heightmin-inline-sizemin-widthmix-blend-mode
O - P
object-fitobject-positionobject-view-boxoffset-anchoroffset-distanceoffset-pathoffset-positionoffset-rotateoffset(Kurzschreibweise)opacityorderorphansoutline-coloroutline-offsetoutline-styleoutline-widthoutline(Kurzschreibweise)overflow-anchoroverflow-blockoverflow-clip-marginoverflow-inlineoverflow-wrapoverflow-xoverflow-yoverflow(Kurzschreibweise)overlayoverscroll-behavior-blockoverscroll-behavior-inlineoverscroll-behavior-xoverscroll-behavior-yoverscroll-behavior(Kurzschreibweise)padding-block-endpadding-block-startpadding-block(Kurzschreibweise)padding-bottompadding-inline-endpadding-inline-startpadding-inline(Kurzschreibweise)padding-leftpadding-rightpadding-toppadding(Kurzschreibweise)page-break-afterpage-break-beforepage-break-insidepagepaint-orderpath-lengthperspective-originperspectiveplace-content(Kurzschreibweise)place-items(Kurzschreibweise)place-self(Kurzschreibweise)pointer-eventsposition-anchorposition-areaposition-try-fallbacksposition-try-orderposition-try(Kurzschreibweise)position-visibilitypositionprint-color-adjust
Q - S
quotesrreading-flowreading-orderresizerightrotaterow-gapruby-alignruby-overhangruby-positionrxryscalescroll-behaviorscroll-initial-targetscroll-margin-block-endscroll-margin-block-startscroll-margin-block(Kurzschreibweise)scroll-margin-bottomscroll-margin-inline-endscroll-margin-inline-startscroll-margin-inline(Kurzschreibweise)scroll-margin-leftscroll-margin-rightscroll-margin-topscroll-margin(Kurzschreibweise)scroll-marker-groupscroll-padding-block-endscroll-padding-block-startscroll-padding-block(Kurzschreibweise)scroll-padding-bottomscroll-padding-inline-endscroll-padding-inline-startscroll-padding-inline(Kurzschreibweise)scroll-padding-leftscroll-padding-rightscroll-padding-topscroll-padding(Kurzschreibweise)scroll-snap-alignscroll-snap-stopscroll-snap-typescroll-target-groupscroll-timeline-axisscroll-timeline-namescroll-timeline(Kurzschreibweise)scrollbar-colorscrollbar-gutterscrollbar-widthshape-image-thresholdshape-marginshape-outsideshape-renderingspeak-asstop-colorstop-opacitystroke-dasharraystroke-dashoffsetstroke-linecapstroke-linejoinstroke-miterlimitstroke-opacitystroke-widthstroke
T - Z
tab-sizetable-layouttext-align-lasttext-aligntext-anchortext-autospacetext-box-edgetext-box-trimtext-box(Kurzschreibweise)text-combine-uprighttext-decoration-colortext-decoration-insettext-decoration-linetext-decoration-skip-inktext-decoration-skiptext-decoration-styletext-decoration-thicknesstext-decoration(Kurzschreibweise)text-emphasis-colortext-emphasis-positiontext-emphasis-styletext-emphasis(Kurzschreibweise)text-indenttext-justifytext-orientationtext-overflowtext-renderingtext-shadowtext-size-adjusttext-spacing-trimtext-transformtext-underline-offsettext-underline-positiontext-wrap-modetext-wrap-styletext-wrap(Kurzschreibweise)timeline-scopetoptouch-actiontransform-boxtransform-origintransform-styletransformtransition-behaviortransition-delaytransition-durationtransition-propertytransition-timing-functiontransition(Kurzschreibweise)translateunicode-bidiuser-modifyuser-selectvector-effectvertical-align(Kurzschreibweise)view-timeline-axisview-timeline-insetview-timeline-nameview-timeline(Kurzschreibweise)view-transition-classview-transition-namevisibilitywhite-space-collapsewhite-spacewidowswidthwill-changeword-breakword-spacingwriting-modexyz-indexzoom
Nicht standardisierte Eigenschaften
Nicht standardisierte, mit einem Vendor-Prefix versehene Eigenschaften umfassen:
-moz- Präfix
-webkit- Präfix
-webkit-box-reflect-webkit-border-before(Kurzschreibweise)-webkit-mask-box-image(Kurzschreibweise)-webkit-mask-composite-webkit-mask-position-x-webkit-mask-position-y-webkit-mask-repeat-x-webkit-mask-repeat-y-webkit-tap-highlight-color-webkit-text-fill-color-webkit-text-security-webkit-text-stroke(Kurzschreibweise)-webkit-text-stroke-color-webkit-text-stroke-width-webkit-touch-callout
Spezifikationen
| Spezifikation |
|---|
| CSS Syntax Module Level 3> |
| CSS Snapshot 2024> |
| CSS Cascading and Inheritance Level 6> |