CSS-Eigenschaften
Eine CSS Eigenschaft ist ein Parameter, der in einer CSS-Deklaration verwendet wird und es Ihnen ermöglicht, bestimmte Aspekte ausgewählter Elemente zu gestalten. Zum Beispiel wird die opacity-Eigenschaft verwendet, um die Deckkraft eines ausgewählten Elements festzulegen und steuert somit, ob Inhalte hinter diesem Element sichtbar sind:
/* 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 Kurzformen von Eigenschaften, sodass Sie mehrere verwandte Eigenschaften in einer einzigen Deklaration angeben können. Beispielsweise ist die margin-Eigenschaft eine Kurzform für margin-top, margin-right, margin-bottom und margin-left, womit der Abstand auf allen vier Seiten eines Elements festgelegt wird:
/* Give <img> elements 1rem of margin */
img {
margin: 1rem;
}
Syntax
selector {
property: value;
}
Alphabetisches Verzeichnis der Eigenschaften
Von CSS-Spezifikationen definierte Standard-Eigenschaften umfassen folgende:
Verschiedenes
A
accent-coloralign-contentalign-itemsalign-selfalignment-baselineall(Kurzform)anchor-nameanchor-scopeanimation-compositionanimation-delayanimation-directionanimation-durationanimation-fill-modeanimation-iteration-countanimation-nameanimation-play-stateanimation-range-endanimation-range-startanimation-range(Kurzform)animation-timelineanimation-timing-functionanimation(Kurzform)appearanceaspect-ratio
B
backdrop-filterbackface-visibilitybackground-attachmentbackground-blend-modebackground-clipbackground-colorbackground-imagebackground-originbackground-position-xbackground-position-ybackground-positionbackground-repeat(Kurzform)background-repeat-xbackground-repeat-ybackground-sizebackground(Kurzform)baseline-shiftbaseline-sourceblock-size
Border-*
border-block-colorborder-block-end-colorborder-block-end-styleborder-block-end-widthborder-block-end(Kurzform)border-block-start-colorborder-block-start-styleborder-block-start-widthborder-block-start(Kurzform)border-block-styleborder-block-widthborder-block(Kurzform)border-bottom-colorborder-bottom-left-radiusborder-bottom-right-radiusborder-bottom-styleborder-bottom-widthborder-bottom(Kurzform)border-collapseborder-color(Kurzform)border-end-end-radiusborder-end-start-radiusborder-image-outsetborder-image-repeatborder-image-sliceborder-image-sourceborder-image-widthborder-image(Kurzform)border-inline-colorborder-inline-end-colorborder-inline-end-styleborder-inline-end-widthborder-inline-end(Kurzform)border-inline-start-colorborder-inline-start-styleborder-inline-start-widthborder-inline-start(Kurzform)border-inline-styleborder-inline-widthborder-inline(Kurzform)border-left-colorborder-left-styleborder-left-widthborder-left(Kurzform)border-radius(Kurzform)border-right-colorborder-right-styleborder-right-widthborder-right(Kurzform)border-spacingborder-start-end-radiusborder-start-start-radiusborder-style(Kurzform)border-top-colorborder-top-left-radiusborder-top-right-radiusborder-top-styleborder-top-widthborder-top(Kurzform)border-width(Kurzform)border(Kurzform)
B - C
bottombox-alignbox-decoration-breakbox-directionbox-flex-groupbox-flexbox-linesbox-ordinal-groupbox-orientbox-packbox-shadowbox-sizingbreak-afterbreak-beforebreak-insidecaption-sidecaret-animationcaret-colorcaret-shapecaret(Kurzform)clearclip-pathclip-ruleclipcolor-interpolation-filterscolor-interpolationcolor-schemecolorcolumn-countcolumn-fillcolumn-gapcolumn-heightcolumn-rule-colorcolumn-rule-stylecolumn-rule-widthcolumn-rule(Kurzform)column-spancolumn-widthcolumn-wrapcolumns(Kurzform)contain-intrinsic-block-sizecontain-intrinsic-heightcontain-intrinsic-inline-sizecontain-intrinsic-size(Kurzform)contain-intrinsic-widthcontaincontainer-namecontainer-typecontainer(Kurzform)content-visibilitycontentcorner-block-end-shapecorner-block-start-shapecorner-bottom-left-shapecorner-bottom-right-shapecorner-bottom-shape(Kurzform)corner-end-end-shapecorner-end-start-shapecorner-inline-end-shapecorner-inline-start-shapecorner-left-shape(Kurzform)corner-right-shape(Kurzform)corner-shape(Kurzform)corner-start-end-shapecorner-start-start-shapecorner-top-left-shapecorner-top-right-shapecorner-top-shape(Kurzform)counter-incrementcounter-resetcounter-setcursorcxcy
D - F
ddirectiondisplaydominant-baselinedynamic-range-limitempty-cellsfield-sizingfill-opacityfill-rulefillfilterflex-basisflex-directionflex-flow(Kurzform)flex-growflex-shrinkflex-wrapflex(Kurzform)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(Kurzform)font-variant-alternatesfont-variant-capsfont-variant-east-asianfont-variant-emojifont-variant-ligaturesfont-variant-numericfont-variant-positionfont-variant(Kurzform)font-variation-settingsfont-weightfont-widthfont(Kurzform)forced-color-adjust
G - I
gap(Kurzform)grid-area(Kurzform)grid-auto-columnsgrid-auto-flowgrid-auto-rowsgrid-column-endgrid-column-startgrid-column(Kurzform)grid-row-endgrid-row-startgrid-row(Kurzform)grid-template-areasgrid-template-columnsgrid-template-rowsgrid-template(Kurzform)grid(Kurzform)hanging-punctuationheighthyphenate-characterhyphenate-limit-charshyphensimage-orientationimage-renderingimage-resolutioninitial-letterinline-sizeinset-block-endinset-block-startinset-block(Kurzform)inset-inline-endinset-inline-startinset-inline(Kurzform)inset(Kurzform)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(Kurzform)margin-block-endmargin-block-startmargin-block(Kurzform)margin-bottommargin-inline-endmargin-inline-startmargin-inline(Kurzform)margin-leftmargin-rightmargin-topmargin-trimmargin(Kurzform)marker-endmarker-midmarker-startmarkermask-border-modemask-border-outsetmask-border-repeatmask-border-slicemask-border-sourcemask-border-widthmask-border(Kurzform)mask-clipmask-compositemask-imagemask-modemask-originmask-positionmask-repeatmask-sizemask-typemask(Kurzform)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(Kurzform)opacityorderorphansoutline-coloroutline-offsetoutline-styleoutline-widthoutline(Kurzform)overflow-anchoroverflow-blockoverflow-clip-marginoverflow-inlineoverflow-wrapoverflow-xoverflow-yoverflow(Kurzform)overlayoverscroll-behavior-blockoverscroll-behavior-inlineoverscroll-behavior-xoverscroll-behavior-yoverscroll-behavior(Kurzform)padding-block-endpadding-block-startpadding-block(Kurzform)padding-bottompadding-inline-endpadding-inline-startpadding-inline(Kurzform)padding-leftpadding-rightpadding-toppadding(Kurzform)page-break-afterpage-break-beforepage-break-insidepagepaint-orderperspective-originperspectiveplace-content(Kurzform)place-items(Kurzform)place-self(Kurzform)pointer-eventsposition-anchorposition-areaposition-try-fallbacksposition-try-orderposition-try(Kurzform)position-visibilitypositionprint-color-adjust
Q - S
quotesrreading-flowreading-orderresizerightrotaterow-gapruby-alignruby-overhangruby-positionrxryscalescroll-behaviorscroll-initial-targetscroll-margin-block-endscroll-margin-block-startscroll-margin-block(Kurzform)scroll-margin-bottomscroll-margin-inline-endscroll-margin-inline-startscroll-margin-inline(Kurzform)scroll-margin-leftscroll-margin-rightscroll-margin-topscroll-margin(Kurzform)scroll-marker-groupscroll-padding-block-endscroll-padding-block-startscroll-padding-block(Kurzform)scroll-padding-bottomscroll-padding-inline-endscroll-padding-inline-startscroll-padding-inline(Kurzform)scroll-padding-leftscroll-padding-rightscroll-padding-topscroll-padding(Kurzform)scroll-snap-alignscroll-snap-stopscroll-snap-typescroll-target-groupscroll-timeline-axisscroll-timeline-namescroll-timeline(Kurzform)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(Kurzform)text-combine-uprighttext-decoration-colortext-decoration-insettext-decoration-linetext-decoration-skip-inktext-decoration-skiptext-decoration-styletext-decoration-thicknesstext-decoration(Kurzform)text-emphasis-colortext-emphasis-positiontext-emphasis-styletext-emphasis(Kurzform)text-indenttext-justifytext-orientationtext-overflowtext-renderingtext-shadowtext-size-adjusttext-spacing-trimtext-transformtext-underline-offsettext-underline-positiontext-wrap-modetext-wrap-styletext-wrap(Kurzform)timeline-scopetoptouch-actiontransform-boxtransform-origintransform-styletransformtransition-behaviortransition-delaytransition-durationtransition-propertytransition-timing-functiontransition(Kurzform)translateunicode-bidiuser-modifyuser-selectvector-effectvertical-alignview-timeline-axisview-timeline-insetview-timeline-nameview-timeline(Kurzform)view-transition-classview-transition-namevisibilitywhite-space-collapsewhite-spacewidowswidthwill-changeword-breakword-spacingwriting-modexyz-indexzoom
Nicht-standardisierte Eigenschaften
Nicht-standardisierte vendor-präfixierte Eigenschaften umfassen:
-moz- Präfix
-webkit- Präfix
-webkit-box-reflect-webkit-border-before(Kurzform)-webkit-mask-box-image(Kurzform)-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(Kurzform)-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> |