CSS-Eigenschaften
Eine CSS Eigenschaft ist ein Parameter, der in einer CSS-Deklaration verwendet wird und ermöglicht, bestimmte Aspekte der ausgewählten Elemente zu gestalten. Zum Beispiel wird die opacity
-Eigenschaft verwendet, um die Deckkraft eines ausgewählten Elements festzulegen, sodass Sie kontrollieren 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 Kurznotationen, sodass Sie mehrere verwandte Eigenschaften in einer einzigen Deklaration angeben können. Zum Beispiel ist die margin
-Eigenschaft eine Kurznotation für margin-top
, margin-right
, margin-bottom
und margin-left
, die den Rand aller vier Seiten eines Elements festlegt:
/* Give <img> elements 1rem of margin */
img {
margin: 1rem;
}
Syntax
selector {
property: value;
}
Alphabetisches Verzeichnis der Eigenschaften
Standard-Eigenschaften, die durch CSS-Spezifikationen definiert werden, umfassen folgende:
Verschiedenes
A
accent-color
align-content
align-items
align-self
alignment-baseline
all
(Kurznotation)anchor-name
animation-composition
animation-delay
animation-direction
animation-duration
animation-fill-mode
animation-iteration-count
animation-name
animation-play-state
animation-range-end
animation-range-start
animation-range
(Kurznotation)animation-timeline
animation-timing-function
animation
(Kurznotation)appearance
aspect-ratio
B
Border-*
border-block-color
border-block-end-color
border-block-end-style
border-block-end-width
border-block-end
(Kurznotation)border-block-start-color
border-block-start-style
border-block-start-width
border-block-start
(Kurznotation)border-block-style
border-block-width
border-block
(Kurznotation)border-bottom-color
border-bottom-left-radius
border-bottom-right-radius
border-bottom-style
border-bottom-width
border-bottom
(Kurznotation)border-collapse
border-color
(Kurznotation)border-end-end-radius
border-end-start-radius
border-image-outset
border-image-repeat
border-image-slice
border-image-source
border-image-width
border-image
(Kurznotation)border-inline-color
border-inline-end-color
border-inline-end-style
border-inline-end-width
border-inline-end
(Kurznotation)border-inline-start-color
border-inline-start-style
border-inline-start-width
border-inline-start
(Kurznotation)border-inline-style
border-inline-width
border-inline
(Kurznotation)border-left-color
border-left-style
border-left-width
border-left
(Kurznotation)border-radius
(Kurznotation)border-right-color
border-right-style
border-right-width
border-right
(Kurznotation)border-spacing
border-start-end-radius
border-start-start-radius
border-style
(Kurznotation)border-top-color
border-top-left-radius
border-top-right-radius
border-top-style
border-top-width
border-top
(Kurznotation)border-width
(Kurznotation)border
(Kurznotation)
B - C
bottom
box-align
box-decoration-break
box-direction
box-flex-group
box-flex
box-lines
box-ordinal-group
box-orient
box-pack
box-shadow
box-sizing
break-after
break-before
break-inside
caption-side
caret-color
clear
clip-path
clip-rule
clip
color-interpolation-filters
color-interpolation
color-scheme
color
column-count
column-fill
column-gap
column-rule-color
column-rule-style
column-rule-width
column-rule
(Kurznotation)column-span
column-width
columns
(Kurznotation)contain-intrinsic-block-size
contain-intrinsic-height
contain-intrinsic-inline-size
contain-intrinsic-size
(Kurznotation)contain-intrinsic-width
contain
container-name
container-type
container
(Kurznotation)content-visibility
content
counter-increment
counter-reset
counter-set
cursor
cx
cy
D - F
d
direction
display
dominant-baseline
empty-cells
field-sizing
fill-opacity
fill-rule
fill
filter
flex-basis
flex-direction
flex-flow
(Kurznotation)flex-grow
flex-shrink
flex-wrap
flex
(Kurznotation)float
flood-color
flood-opacity
font-family
font-feature-settings
font-kerning
font-language-override
font-optical-sizing
font-palette
font-size-adjust
font-size
font-smooth
font-stretch
font-style
font-synthesis-position
font-synthesis-small-caps
font-synthesis-style
font-synthesis-weight
font-synthesis
(Kurznotation)font-variant-alternates
font-variant-caps
font-variant-east-asian
font-variant-emoji
font-variant-ligatures
font-variant-numeric
font-variant-position
font-variant
(Kurznotation)font-variation-settings
font-weight
font
(Kurznotation)forced-color-adjust
G - I
gap
(Kurznotation)grid-area
(Kurznotation)grid-auto-columns
grid-auto-flow
grid-auto-rows
grid-column-end
grid-column-start
grid-column
(Kurznotation)grid-row-end
grid-row-start
grid-row
(Kurznotation)grid-template-areas
grid-template-columns
grid-template-rows
grid-template
(Kurznotation)grid
(Kurznotation)hanging-punctuation
height
hyphenate-character
hyphenate-limit-chars
hyphens
image-orientation
image-rendering
image-resolution
initial-letter
inline-size
inset-block-end
inset-block-start
inset-block
(Kurznotation)inset-block
(Kurznotation)inset-inline-end
inset-inline-start
inset-inline
(Kurznotation)inset-inline
(Kurznotation)inset
(Kurznotation)inset
(Kurznotation)interpolate-size
isolation
J - M
justify-content
justify-items
justify-self
left
letter-spacing
lighting-color
line-break
line-clamp
line-height-step
line-height
list-style-image
list-style-position
list-style-type
list-style
(Kurznotation)list-style
(Kurznotation)margin-block-end
margin-block-start
margin-block
(Kurznotation)margin-bottom
margin-inline-end
margin-inline-start
margin-inline
(Kurznotation)margin-left
margin-right
margin-top
margin-trim
margin
(Kurznotation)marker-end
marker-mid
marker-start
marker
mask-border-mode
mask-border-outset
mask-border-repeat
mask-border-slice
mask-border-source
mask-border-width
mask-border
(Kurznotation)mask-clip
mask-composite
mask-image
mask-mode
mask-origin
mask-position
mask-repeat
mask-size
mask-type
mask
(Kurznotation)math-depth
math-shift
math-style
max-block-size
max-height
max-inline-size
max-width
min-block-size
min-height
min-inline-size
min-width
mix-blend-mode
O - P
object-fit
object-position
offset-anchor
offset-distance
offset-path
offset-position
offset-rotate
offset
(Kurznotation)opacity
order
orphans
outline-color
outline-offset
outline-style
outline-width
outline
(Kurznotation)overflow-anchor
overflow-block
overflow-clip-margin
overflow-inline
overflow-wrap
overflow-x
overflow-y
overflow
(Kurznotation)overlay
overscroll-behavior-block
overscroll-behavior-inline
overscroll-behavior-x
overscroll-behavior-y
overscroll-behavior
(Kurznotation)padding-block-end
padding-block-start
padding-block
(Kurznotation)padding-bottom
padding-inline-end
padding-inline-start
padding-inline
(Kurznotation)padding-left
padding-right
padding-top
padding
(Kurznotation)page-break-after
page-break-before
page-break-inside
page
paint-order
perspective-origin
perspective
place-content
(Kurznotation)place-items
(Kurznotation)place-self
(Kurznotation)pointer-events
position-anchor
position-area
position-try-fallbacks
position-try-order
position-try
(Kurznotation)position-visibility
position
print-color-adjust
Q - S
quotes
r
reading-flow
reading-order
resize
right
rotate
row-gap
ruby-align
ruby-position
rx
ry
scale
scroll-behavior
scroll-margin-block-end
scroll-margin-block-start
scroll-margin-block
(Kurznotation)scroll-margin-bottom
scroll-margin-inline-end
scroll-margin-inline-start
scroll-margin-inline
(Kurznotation)scroll-margin-left
scroll-margin-right
scroll-margin-top
scroll-margin
(Kurznotation)scroll-marker-group
scroll-padding-block-end
scroll-padding-block-start
scroll-padding-block
(Kurznotation)scroll-padding-bottom
scroll-padding-inline-end
scroll-padding-inline-start
scroll-padding-inline
(Kurznotation)scroll-padding-left
scroll-padding-right
scroll-padding-top
scroll-padding
(Kurznotation)scroll-snap-align
scroll-snap-stop
scroll-snap-type
scroll-timeline-axis
scroll-timeline-name
scroll-timeline
(Kurznotation)scrollbar-color
scrollbar-gutter
scrollbar-width
shape-image-threshold
shape-margin
shape-outside
shape-rendering
speak-as
stop-color
stop-opacity
stroke-dasharray
stroke-dashoffset
stroke-linecap
stroke-linejoin
stroke-miterlimit
stroke-opacity
stroke-width
stroke
T - Z
tab-size
table-layout
text-align-last
text-align
text-anchor
text-box-edge
text-box-trim
text-box
(Kurznotation)text-combine-upright
text-decoration-color
text-decoration-line
text-decoration-skip-ink
text-decoration-skip
text-decoration-style
text-decoration-thickness
text-decoration
(Kurznotation)text-emphasis-color
text-emphasis-position
text-emphasis-style
text-emphasis
(Kurznotation)text-indent
text-justify
text-orientation
text-overflow
text-rendering
text-shadow
text-size-adjust
text-spacing-trim
text-transform
text-underline-offset
text-underline-position
text-wrap-mode
text-wrap-style
text-wrap
(Kurznotation)timeline-scope
top
touch-action
transform-box
transform-origin
transform-style
transform
transition-behavior
transition-delay
transition-duration
transition-property
transition-timing-function
transition
(Kurznotation)translate
unicode-bidi
user-modify
user-select
vector-effect
vertical-align
view-timeline-axis
view-timeline-inset
view-timeline-name
view-timeline
(Kurznotation)view-transition-class
view-transition-name
visibility
white-space-collapse
white-space
widows
width
will-change
word-break
word-spacing
writing-mode
x
y
z-index
zoom
Nicht-standardisierte Eigenschaften
Nicht-standardisierte oder anbieterpräfixierte Eigenschaften umfassen Folgendes:
-moz-
Präfix
-moz-float-edge
-moz-force-broken-image-icon
-moz-image-region
-moz-orient
-moz-user-focus
-moz-user-input
-webkit-
Präfix
-webkit-box-reflect
-webkit-border-before
(Kurznotation)-webkit-mask-box-image
(Kurznotation)-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
(Kurznotation)-webkit-text-stroke-color
-webkit-text-stroke-width
-webkit-touch-callout
Spezifikationen
Specification |
---|
CSS Syntax Module Level 3 |
CSS Snapshot 2024 |
CSS Cascading and Inheritance Level 6 |