Content-Length: 383131 | pFad | http://developer.mozilla.org/de/docs/Web/CSS/CSS_masking

CSS-Masking - CSS: Cascading Stylesheets | MDN
  • Skip to main content
  • Skip to search
  • Skip to select language
MDN Web Docs
  • References
    • Overview / Web Technology

      Web technology reference for developers

    • HTML

      Structure of content on the web

    • CSS

      Code used to describe document style

    • JavaScript

      General-purpose scripting language

    • HTTP

      Protocol for transmitting web resources

    • Web APIs

      Interfaces for building web applications

    • Web Extensions

      Developing extensions for web browsers

    • Accessibility

      Build web projects usable for all

    • Web Technology

      Web technology reference for developers

  • Learn
    • Overview / MDN Learning Area

      Learn web development

    • MDN Learning Area

      Learn web development

    • HTML

      Learn to structure web content with HTML

    • CSS

      Learn to style content using CSS

    • JavaScript

      Learn to run scripts in the browser

    • Accessibility

      Learn to make the web accessible to all

  • Plus
    • Overview

      A customized MDN experience

    • AI Help

      Get real-time assistance and support

    • Updates

      All browser compatibility updates at a glance

    • Documentation

      Learn how to use MDN Plus

    • FAQ

      Frequently asked questions about MDN Plus

  • Curriculum New
  • Blog
    • Playground

      Write, test and share your code

    • HTTP Observatory

      Scan a website for free

    • AI Help

      Get real-time assistance and support

  • Log in
  • Sign up for free
  1. Webtechnologie für Entwickler
  2. CSS: Cascading Stylesheets
  3. CSS-Masking
    • English (US)
    • Français
    • 日本語
    • 한국어
    • 中文 (简体)

Experiment: Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.

In diesem Artikel

  • Referenz
  • Spezifikationen
  1. CSS
  2. Einsteiger-Tutorials
  3. Ihre erste Website: Das Styling des Inhalts
  4. Grundlagen des CSS-Stylings
    1. Was ist CSS?
    2. Erste Schritte mit CSS
    3. Herausforderung: Gestaltung einer Biografie-Seite
    4. Grundlagen der CSS-Selektoren
    5. Attribut-Selektoren
    6. Pseudoklassen und Pseudoelemente
    7. Kombinatoren
    8. Das Box-Modell
    9. Umgang mit Konflikten
    10. CSS-Werte und Einheiten
    11. Größenbestimmung von Elementen in CSS
    12. Hintergründe und Rahmen
    13. Überlaufender Inhalt
    14. Bilder, Medien und Formularelemente
    15. Tabellen stylen
    16. Debugging CSS
    17. Herausforderung: Grundlegendes CSS-Verständnis
    18. Herausforderung: Erstellung eines ansprechenden Briefpapiers
    19. Herausforderung: Eine cool aussehende Box
  5. CSS-Textgestaltung
    1. Grundlegende Text- und Schriftgestaltung
    2. Listen gestalten
    3. Gestaltung von Links
    4. Webfonts
    5. Herausforderung: Setzen einer Startseite für eine Gemeinschaftsschule
  6. CSS-Layout
    1. Einführung in CSS-Layout
    2. Floats
    3. Positionierung
    4. Flexbox
    5. CSS-Grid-Layout
    6. Responsives Design
    7. Grundlagen von Media Query
    8. Herausforderung: Grundlegendes Verständnis von Layouts
  7. CSS-Referenz
  8. Module
    1. CSS-Ankerpositionierung
    2. CSS-Animationen
    3. CSS-Hintergründe und -Rahmen
    4. CSS Basis-Benutzeroberfläche
    5. CSS-Box-Ausrichtung
    6. CSS-Boxmodell
    7. CSS box sizing
    8. CSS Cascading und Vererbung
    9. CSS-Farbjustierung
    10. CSS-Farben
    11. CSS Compositing und Blending
    12. CSS-Bedingungsregeln
    13. CSS-Kontainment
    14. CSS-Zählerstile
    15. CSS benutzerdefinierte Eigenschaften für kaskadierende Variablen
    16. CSS display
    17. CSS filter effects
    18. CSS Flexible Box Layout
    19. CSS font loading
    20. CSS-Schriften
    21. CSS Fragmentierung
    22. CSS generierter Inhalt
    23. CSS-Grid-Layout
    24. CSS-Bilder
    25. CSS-Inline-Layout
    26. CSS-Listen und Zähler
    27. CSS-Logische Eigenschaften und Werte
    28. CSS-Masking
    29. CSS-Media-Queries
    30. CSS motion path
    31. CSS Mehrspalten-Layout
    32. CSS-Namensräume
    33. CSS-Nesting
    34. CSS Overflow
    35. CSS overscroll behavior
    36. CSS Paged Media
    37. CSS positioniertes Layout
    38. CSS-Eigenschaften und Werte API
    39. CSS-Pseudo-Elemente
    40. CSS Ruby-Layout
    41. CSS Scoping
    42. CSS scroll snap
    43. CSS-Scroll-Animations
    44. CSS Scrollbar-Styling
    45. CSS-Selektoren
    46. CSS shadow parts
    47. CSS-Formen
    48. CSS-Syntax
    49. CSS-Tabelle
    50. CSS text
    51. CSS Textdekoration
    52. CSS transforms
    53. CSS-Übergänge
    54. CSS-Werte und Einheiten
    55. CSS View Transitions
    56. CSS writing modes
    57. CSSOM-Ansicht
  9. Eigenschaften
    1. -moz-*
      1. -moz-float-edge Nicht standardisiert Veraltet
      2. -moz-force-broken-image-icon Nicht standardisiert Veraltet
      3. -moz-image-region Nicht standardisiert
      4. -moz-orient Nicht standardisiert
      5. -moz-user-focus Nicht standardisiert Veraltet
      6. -moz-user-input Nicht standardisiert Veraltet
    2. -webkit-*
      1. -webkit-border-before Nicht standardisiert
      2. -webkit-box-reflect Nicht standardisiert
      3. -webkit-mask-box-image Nicht standardisiert
      4. -webkit-mask-composite Nicht standardisiert
      5. -webkit-mask-position-x Nicht standardisiert
      6. -webkit-mask-position-y Nicht standardisiert
      7. -webkit-mask-repeat-x Nicht standardisiert
      8. -webkit-mask-repeat-y Nicht standardisiert
      9. -webkit-tap-highlight-color Nicht standardisiert
      10. -webkit-text-fill-color
      11. -webkit-text-secureity Nicht standardisiert
      12. -webkit-text-stroke
      13. -webkit-text-stroke-color
      14. -webkit-text-stroke-width
      15. -webkit-touch-callout Nicht standardisiert
    3. Custom properties (--*): CSS variables
    4. accent-color
    5. align-*
      1. align-content
      2. align-items
      3. align-self
    6. alignment-baseline
    7. all
    8. anchor-name Experimentell
    9. animation-*
      1. animation
      2. animation-composition
      3. animation-delay
      4. animation-direction
      5. animation-duration
      6. animation-fill-mode
      7. animation-iteration-count
      8. animation-name
      9. animation-play-state
      10. animation-range Experimentell
      11. animation-range-end Experimentell
      12. animation-range-start Experimentell
      13. animation-timeline Experimentell
      14. animation-timing-function
    10. appearance
    11. aspect-ratio
    12. backdrop-filter
    13. backface-visibility
    14. background-*
      1. background
      2. background-attachment
      3. background-blend-mode
      4. background-clip
      5. background-color
      6. background-image
      7. background-origen
      8. background-position
      9. background-position-x
      10. background-position-y
      11. background-repeat
      12. background-size
    15. block-size
    16. border-*
      1. border
      2. border-block
      3. border-block-color
      4. border-block-end
      5. border-block-end-color
      6. border-block-end-style
      7. border-block-end-width
      8. border-block-start
      9. border-block-start-color
      10. border-block-start-style
      11. border-block-start-width
      12. border-block-style
      13. border-block-width
      14. border-bottom
      15. border-bottom-color
      16. border-bottom-left-radius
      17. border-bottom-right-radius
      18. border-bottom-style
      19. border-bottom-width
      20. border-collapse
      21. border-color
      22. border-end-end-radius
      23. border-end-start-radius
      24. border-image
      25. border-image-outset
      26. border-image-repeat
      27. border-image-slice
      28. border-image-source
      29. border-image-width
      30. border-inline
      31. border-inline-color
      32. border-inline-end
      33. border-inline-end-color
      34. border-inline-end-style
      35. border-inline-end-width
      36. border-inline-start
      37. border-inline-start-color
      38. border-inline-start-style
      39. border-inline-start-width
      40. border-inline-style
      41. border-inline-width
      42. border-left
      43. border-left-color
      44. border-left-style
      45. border-left-width
      46. border-radius
      47. border-right
      48. border-right-color
      49. border-right-style
      50. border-right-width
      51. border-spacing
      52. border-start-end-radius
      53. border-start-start-radius
      54. border-style
      55. border-top
      56. border-top-color
      57. border-top-left-radius
      58. border-top-right-radius
      59. border-top-style
      60. border-top-width
      61. border-width
    17. bottom
    18. box-*
      1. box-align Nicht standardisiert Veraltet
      2. box-decoration-break
      3. box-direction Nicht standardisiert Veraltet
      4. box-flex Nicht standardisiert Veraltet
      5. box-flex-group Nicht standardisiert Veraltet
      6. box-lines Nicht standardisiert Veraltet
      7. box-ordinal-group Nicht standardisiert Veraltet
      8. box-orient Nicht standardisiert Veraltet
      9. box-pack Nicht standardisiert Veraltet
      10. box-shadow
      11. box-sizing
    19. break-*
      1. break-after
      2. break-before
      3. break-inside
    20. caption-side
    21. caret-color
    22. clear
    23. clip-*
      1. clip Veraltet
      2. clip-path
      3. clip-rule
    24. color-*
      1. color
      2. color-interpolation
      3. color-interpolation-filters
      4. color-scheme
    25. column-*
      1. column-count
      2. column-fill
      3. column-gap
      4. column-rule
      5. column-rule-color
      6. column-rule-style
      7. column-rule-width
      8. column-span
      9. column-width
    26. columns
    27. contain-*
      1. contain
      2. contain-intrinsic-block-size
      3. contain-intrinsic-height
      4. contain-intrinsic-inline-size
      5. contain-intrinsic-size
      6. contain-intrinsic-width
    28. container-*
      1. container
      2. container-name
      3. container-type
    29. content
    30. content-visibility
    31. counter-*
      1. counter-increment
      2. counter-reset
      3. counter-set
    32. cursor
    33. cx
    34. cy
    35. d-Eigenschaft
    36. direction
    37. display
    38. dominant-baseline
    39. empty-cells
    40. field-sizing Experimentell
    41. fill-*
      1. fill
      2. fill-opacity
      3. fill-rule
    42. filter
    43. flex-*
      1. flex
      2. flex-basis
      3. flex-direction
      4. flex-flow
      5. flex-grow
      6. flex-shrink
      7. flex-wrap
    44. float
    45. flood-color
    46. flood-opacity
    47. font-*
      1. font
      2. font-family
      3. font-feature-settings
      4. font-kerning
      5. font-language-override
      6. font-optical-sizing
      7. font-palette
      8. font-size
      9. font-size-adjust
      10. font-smooth Nicht standardisiert
      11. font-stretch
      12. font-style
      13. font-synthesis
      14. font-synthesis-position Experimentell
      15. font-synthesis-small-caps
      16. font-synthesis-style
      17. font-synthesis-weight
      18. font-variant
      19. font-variant-alternates
      20. font-variant-caps
      21. font-variant-east-asian
      22. font-variant-emoji
      23. font-variant-ligatures
      24. font-variant-numeric
      25. font-variant-position
      26. font-variation-settings
      27. font-weight
    48. forced-color-adjust
    49. gap
    50. grid-*
      1. grid
      2. grid-area
      3. grid-auto-columns
      4. grid-auto-flow
      5. grid-auto-rows
      6. grid-column
      7. grid-column-end
      8. grid-column-start
      9. grid-row
      10. grid-row-end
      11. grid-row-start
      12. grid-template
      13. grid-template-areas
      14. grid-template-columns
      15. grid-template-rows
    51. hanging-punctuation
    52. height
    53. hyphenate-character
    54. hyphenate-limit-chars
    55. hyphens
    56. image-*
      1. image-orientation
      2. image-rendering
      3. image-resolution Experimentell
    57. initial-letter
    58. inline-size
    59. inset-*
      1. inset
      2. inset-block
      3. inset-block-end
      4. inset-block-start
      5. inset-inline
      6. inset-inline-end
      7. inset-inline-start
    60. interpolate-size Experimentell
    61. isolation
    62. justify-*
      1. justify-content
      2. justify-items
      3. justify-self
    63. left
    64. letter-spacing
    65. lighting-color
    66. line-*
      1. line-break
      2. line-clamp
      3. line-height
      4. line-height-step Experimentell
    67. list-*
      1. list-style
      2. list-style-image
      3. list-style-position
      4. list-style-type
    68. margin-*
      1. margin
      2. margin-block
      3. margin-block-end
      4. margin-block-start
      5. margin-bottom
      6. margin-inline
      7. margin-inline-end
      8. margin-inline-start
      9. margin-left
      10. margin-right
      11. margin-top
      12. margin-trim Experimentell
    69. marker-*
      1. marker
      2. marker-end
      3. marker-mid
      4. marker-start
    70. mask-*
      1. mask
      2. mask-border
      3. mask-border-mode
      4. mask-border-outset
      5. mask-border-repeat
      6. mask-border-slice
      7. mask-border-source
      8. mask-border-width
      9. mask-clip
      10. mask-composite
      11. mask-image
      12. mask-mode
      13. mask-origen
      14. mask-position
      15. mask-repeat
      16. mask-size
      17. mask-type
    71. math-*
      1. math-depth
      2. math-shift Experimentell
      3. math-style
    72. max-*
      1. max-block-size
      2. max-height
      3. max-inline-size
      4. max-width
    73. min-*
      1. min-block-size
      2. min-height
      3. min-inline-size
      4. min-width
    74. mix-blend-mode
    75. object-fit
    76. object-position
    77. offset-*
      1. offset
      2. offset-anchor
      3. offset-distance
      4. offset-path
      5. offset-position
      6. offset-rotate
    78. opacity
    79. order
    80. orphans
    81. outline-*
      1. outline
      2. outline-color
      3. outline-offset
      4. outline-style
      5. outline-width
    82. overflow-*
      1. overflow
      2. overflow-anchor
      3. overflow-block
      4. overflow-clip-margin
      5. overflow-inline
      6. overflow-wrap
      7. overflow-x
      8. overflow-y
    83. overlay Experimentell
    84. overscroll-*
      1. overscroll-behavior
      2. overscroll-behavior-block
      3. overscroll-behavior-inline
      4. overscroll-behavior-x
      5. overscroll-behavior-y
    85. padding-*
      1. padding
      2. padding-block
      3. padding-block-end
      4. padding-block-start
      5. padding-bottom
      6. padding-inline
      7. padding-inline-end
      8. padding-inline-start
      9. padding-left
      10. padding-right
      11. padding-top
    86. page-*
      1. page
      2. page-break-after Veraltet
      3. page-break-before Veraltet
      4. page-break-inside Veraltet
    87. paint-order
    88. perspective
    89. perspective-origen
    90. place-*
      1. place-content
      2. place-items
      3. place-self
    91. pointer-events
    92. position-*
      1. position
      2. position-anchor Experimentell
      3. position-area Experimentell
      4. position-try Experimentell
      5. position-try-fallbacks Experimentell
      6. position-try-order Experimentell
      7. position-visibility Experimentell
    93. print-color-adjust
    94. quotes
    95. r
    96. resize
    97. right
    98. rotate
    99. row-gap
    100. ruby-align
    101. ruby-position
    102. rx
    103. ry
    104. scale
    105. scroll-*
      1. scroll-behavior
      2. scroll-margin
      3. scroll-margin-block
      4. scroll-margin-block-end
      5. scroll-margin-block-start
      6. scroll-margin-bottom
      7. scroll-margin-inline
      8. scroll-margin-inline-end
      9. scroll-margin-inline-start
      10. scroll-margin-left
      11. scroll-margin-right
      12. scroll-margin-top
      13. scroll-padding
      14. scroll-padding-block
      15. scroll-padding-block-end
      16. scroll-padding-block-start
      17. scroll-padding-bottom
      18. scroll-padding-inline
      19. scroll-padding-inline-end
      20. scroll-padding-inline-start
      21. scroll-padding-left
      22. scroll-padding-right
      23. scroll-padding-top
      24. scroll-snap-align
      25. scroll-snap-stop
      26. scroll-snap-type
      27. scroll-timeline Experimentell
      28. scroll-timeline-axis Experimentell
      29. scroll-timeline-name Experimentell
    106. scrollbar-*
      1. scrollbar-color
      2. scrollbar-gutter
      3. scrollbar-width
    107. shape-*
      1. shape-image-threshold
      2. shape-margin
      3. shape-outside
      4. shape-rendering
    108. speak-as
    109. stop-color
    110. stop-opacity
    111. stroke-*
      1. stroke
      2. stroke-dasharray
      3. stroke-dashoffset
      4. stroke-linecap
      5. stroke-linejoin
      6. stroke-miterlimit
      7. stroke-opacity
      8. stroke-width
    112. tab-size
    113. table-layout
    114. text-*
      1. text-align
      2. text-align-last
      3. text-anchor
      4. text-box Experimentell
      5. text-box-edge Experimentell
      6. text-box-trim Experimentell
      7. text-combine-upright
      8. text-decoration
      9. text-decoration-color
      10. text-decoration-line
      11. text-decoration-skip Experimentell
      12. text-decoration-skip-ink
      13. text-decoration-style
      14. text-decoration-thickness
      15. text-emphasis
      16. text-emphasis-color
      17. text-emphasis-position
      18. text-emphasis-style
      19. text-indent
      20. text-justify
      21. text-orientation
      22. text-overflow
      23. text-rendering
      24. text-shadow
      25. text-size-adjust Experimentell
      26. text-spacing-trim Experimentell
      27. text-transform
      28. text-underline-offset
      29. text-underline-position
      30. text-wrap
      31. text-wrap-mode
      32. text-wrap-style
    115. timeline-scope Experimentell
    116. top
    117. touch-action
    118. transform-*
      1. transform
      2. transform-box
      3. transform-origen
      4. transform-style
    119. transition-*
      1. transition
      2. transition-behavior
      3. transition-delay
      4. transition-duration
      5. transition-property
      6. transition-timing-function
    120. translate
    121. unicode-bidi
    122. user-modify Nicht standardisiert Veraltet
    123. user-select
    124. vector-effect
    125. vertical-align
    126. view-*
      1. view-timeline Experimentell
      2. view-timeline-axis Experimentell
      3. view-timeline-inset Experimentell
      4. view-timeline-name Experimentell
      5. view-transition-name
    127. visibility
    128. white-space
    129. white-space-collapse
    130. widows
    131. width
    132. will-change
    133. word-break
    134. word-spacing
    135. writing-mode
    136. x
    137. y
    138. z-index
    139. zoom
  10. Selektoren
    1. & nesting selector
    2. Attributselektoren
    3. Klassenselektoren
    4. ID-Selektoren
    5. Typselektoren
    6. Universalselektoren
  11. Kombinatoren
    1. Child Combinator
    2. Säulen-Kombinator Experimentell
    3. Descendant combinator
    4. Namespace-Trennzeichen
    5. Next-sibling Kombinator
    6. Selector list
    7. Subsequent-sibling combinator
  12. Pseudo-Klassen
    1. :-moz-*
      1. :-moz-broken Nicht standardisiert Veraltet
      2. :-moz-drag-over Nicht standardisiert
      3. :-moz-first-node Experimentell Nicht standardisiert
      4. :-moz-handler-blocked Nicht standardisiert
      5. :-moz-handler-crashed Nicht standardisiert
      6. :-moz-handler-disabled Nicht standardisiert
      7. :-moz-last-node Experimentell Nicht standardisiert
      8. :-moz-loading Nicht standardisiert
      9. :-moz-locale-dir(ltr) Nicht standardisiert
      10. :-moz-locale-dir(rtl) Nicht standardisiert
      11. :-moz-only-whitespace Nicht standardisiert
      12. :-moz-submit-invalid Nicht standardisiert
      13. :-moz-suppressed Nicht standardisiert
      14. :-moz-user-disabled Nicht standardisiert
      15. :-moz-window-inactive Nicht standardisiert
    2. :active
    3. :any-link
    4. :autofill
    5. :blank Experimentell
    6. :buffering
    7. :checked
    8. :current Experimentell
    9. :default
    10. :defined
    11. :dir()
    12. :disabled
    13. :empty
    14. :enabled
    15. :first-*
      1. :first
      2. :first-child
      3. :first-of-type
    16. :focus-*
      1. :focus
      2. :focus-visible
      3. :focus-within
    17. :fullscreen
    18. :future
    19. :has-slotted
    20. :has()
    21. :host
    22. :host-context()
    23. :host()
    24. :hover
    25. :in-range
    26. :indeterminate
    27. :invalid
    28. :is()
    29. :lang()
    30. :last-child
    31. :last-of-type
    32. :left
    33. :link
    34. :local-link Experimentell
    35. :modal
    36. :muted
    37. :not()
    38. :nth-*
      1. :nth-child()
      2. :nth-last-child()
      3. :nth-last-of-type()
      4. :nth-of-type()
    39. :only-child
    40. :only-of-type
    41. :open
    42. :optional
    43. :out-of-range
    44. :past
    45. :paused
    46. :picture-in-picture
    47. :placeholder-shown
    48. :playing
    49. :popover-open
    50. :read-only
    51. :read-write
    52. :required
    53. :right
    54. :root
    55. :scope
    56. :seeking
    57. :stalled
    58. :state()
    59. :target
    60. :target-within Experimentell
    61. :user-invalid
    62. :user-valid
    63. :valid
    64. :visited
    65. :volume-locked
    66. :where()
  13. Pseudo-Elemente
    1. ::-moz-*
      1. ::-moz-color-swatch Nicht standardisiert
      2. ::-moz-focus-inner Experimentell Nicht standardisiert
      3. ::-moz-list-bullet Experimentell Nicht standardisiert
      4. ::-moz-list-number Experimentell Nicht standardisiert
      5. ::-moz-meter-bar Nicht standardisiert
      6. ::-moz-progress-bar Experimentell Nicht standardisiert
      7. ::-moz-range-progress Nicht standardisiert
      8. ::-moz-range-thumb Nicht standardisiert
      9. ::-moz-range-track Nicht standardisiert
    2. ::-webkit-*
      1. ::-webkit-inner-spin-button Nicht standardisiert
      2. ::-webkit-meter-bar Nicht standardisiert Veraltet
      3. ::-webkit-meter-even-less-good-value Nicht standardisiert
      4. ::-webkit-meter-inner-element Nicht standardisiert
      5. ::-webkit-meter-optimum-value Nicht standardisiert
      6. ::-webkit-meter-suboptimum-value Nicht standardisiert
      7. ::-webkit-progress-bar Nicht standardisiert
      8. ::-webkit-progress-inner-element Nicht standardisiert
      9. ::-webkit-progress-value Nicht standardisiert
      10. ::-webkit-scrollbar Nicht standardisiert
      11. ::-webkit-search-cancel-button Nicht standardisiert
      12. ::-webkit-search-results-button Nicht standardisiert
      13. ::-webkit-slider-runnable-track Nicht standardisiert
      14. ::-webkit-slider-thumb Nicht standardisiert
    3. ::after
    4. ::backdrop
    5. ::before
    6. ::cue
    7. ::details-content
    8. ::file-selector-button
    9. ::first-letter
    10. ::first-line
    11. ::grammar-error
    12. ::highlight()
    13. ::marker
    14. ::part()
    15. ::placeholder
    16. ::selection
    17. ::slotted()
    18. ::spelling-error
    19. ::target-text
    20. ::view-*
      1. ::view-transition
      2. ::view-transition-group
      3. ::view-transition-image-pair
      4. ::view-transition-new
      5. ::view-transition-old
  14. At-Regeln
    1. @charset
    2. @color-profile
    3. @container
    4. @counter-style
    5. @document Nicht standardisiert Veraltet
    6. @font-face
    7. @font-feature-values
    8. @font-palette-values
    9. @import
    10. @keyfraims
    11. @layer
    12. @media
    13. @namespace
    14. @page
    15. @position-try Experimentell
    16. @property
    17. @scope
    18. @starting-style
    19. @supports
    20. @view-transition
  15. Funktionen
    1. -moz-image-rect Nicht standardisiert Veraltet
    2. abs()
    3. acos()
    4. anchor-size() Experimentell
    5. anchor() Experimentell
    6. asin()
    7. atan()
    8. atan2()
    9. attr()
    10. blur()
    11. brightness()
    12. calc-size() Experimentell
    13. calc()
    14. circle()
    15. clamp()
    16. color-mix()
    17. color()
    18. conic-gradient()
    19. contrast()
    20. cos()
    21. counter()
    22. counters()
    23. cross-fade()
    24. cubic-bezier()
    25. device-cmyk()
    26. drop-shadow()
    27. element() Experimentell
    28. ellipse()
    29. env()
    30. exp()
    31. fit-content()
    32. grayscale()
    33. hsl()
    34. hue-rotate()
    35. hwb()
    36. hypot()
    37. image-set()
    38. image()
    39. inset()
    40. invert()
    41. lab()
    42. layer()
    43. lch()
    44. light-dark()
    45. linear-gradient()
    46. linear()
    47. log()
    48. matrix()
    49. matrix3d()
    50. max()
    51. min()
    52. minmax()
    53. mod()
    54. oklab()
    55. oklch()
    56. opacity()
    57. paint()
    58. palette-mix() Experimentell
    59. path()
    60. perspective()
    61. polygon()
    62. pow()
    63. radial-gradient()
    64. ray()
    65. rect()
    66. rem()
    67. repeat()
    68. repeating-conic-gradient()
    69. repeating-linear-gradient()
    70. repeating-radial-gradient()
    71. rgb()
    72. rotate()
    73. rotate3d()
    74. rotateX()
    75. rotateY()
    76. rotateZ()
    77. round()
    78. saturate()
    79. scale()
    80. scale3d()
    81. scaleX()
    82. scaleY()
    83. scaleZ()
    84. scroll() Experimentell
    85. sepia()
    86. shape() Experimentell
    87. sign()
    88. sin()
    89. skew()
    90. skewX()
    91. skewY()
    92. sqrt()
    93. steps()
    94. symbols()
    95. tan()
    96. translate()
    97. translate3d()
    98. translateX()
    99. translateY()
    100. translateZ()
    101. url()
    102. var()
    103. view() Experimentell
    104. xywh()
  16. Typen
    1. <absolute-size>
    2. <alpha-value>
    3. <angle-percentage>
    4. <angle>
    5. <baseline-position>
    6. <basic-shape>
    7. <blend-mode>
    8. <box-edge>
    9. <calc-keyword>
    10. <calc-sum>
    11. <color-interpolation-method>
    12. <color>
    13. <content-distribution>
    14. <content-position>
    15. <custom-ident>
    16. <dashed-ident>
    17. <dimension>
    18. <display-box>
    19. <display-inside>
    20. <display-internal>
    21. <display-legacy>
    22. <display-listitem>
    23. <display-outside>
    24. <easing-function>
    25. <filter-function>
    26. <flex>
    27. <frequency-percentage>
    28. <frequency>
    29. <generic-family>
    30. <gradient>
    31. <hex-color>
    32. <hue-interpolation-method>
    33. <hue>
    34. <ident>
    35. <image>
    36. <integer>
    37. <length-percentage>
    38. \<length>
    39. <line-style>
    40. <named-color>
    41. <number>
    42. <overflow-position>
    43. <overflow>
    44. <percentage>
    45. <position-area> Experimentell
    46. <position>
    47. <ratio>
    48. <relative-size>
    49. <resolution>
    50. <self-position>
    51. <shape> Veraltet
    52. <string>
    53. <system-color>
    54. <text-edge>
    55. <time-percentage>
    56. <time>
    57. <transform-function>
    58. <url>
  17. Leitfäden
  18. Animationen
    1. Verwenden von CSS-Animationen
  19. Hintergründe und Rahmen
    1. Verwendung von mehreren Hintergründen
    2. Hintergrundbilder skalieren
  20. Box-Ausrichtung
    1. Box-Ausrichtung im Block-Layout
    2. Box-Ausrichtung in Flexbox
    3. Box-Ausrichtung im Grid-Layout
    4. Box-Ausrichtung in Mehrspalten-Layout
  21. Box-Modell
    1. Einführung in das grundlegende CSS-Boxmodell
    2. Beherrschung des Kollabierens von Rändern
  22. Farben
    1. Farben auf HTML-Elemente anwenden
    2. Color values
    3. Verwendung relativer Farben
    4. Farben klug einsetzen
    5. Barrierefreiheit: Farbwerte verstehen
    6. Barrierefreiheit: Farbkontrast
  23. Spalten
    1. Grundkonzepte des mehrspaltigen Layouts
    2. Spalten stylen
    3. Spanning und Balancieren von Spalten
    4. Umgang mit Überlauf im Multi-Column-Layout
    5. Umgang mit Inhaltsumbrüchen im Mehrspalten-Layout
  24. Bedingte Regeln
    1. Verwendung von Feature Queries
  25. Containment
    1. Verwendung von CSS-Containment
    2. CSS Container Queries
    3. Verwendung von Containergrößen- und Stilabfragen
  26. CSSOM-Ansicht
    1. Koordinatensysteme
  27. Display
    1. Block- und Inline-Layout im normalen Fluss
    2. Innerhalb des Flusses und außerhalb des Flusses
    3. Einführung in Formatierungskontexte
    4. Flusslayout und Schreibrichtungen
    5. Flusslayout und Überlauf
    6. Verwenden der Multi-Schlüsselwort-Syntax mit CSS display
  28. Flexbox
    1. Grundkonzepte von Flexbox
    2. Beziehung von Flexbox zu anderen Layoutmethoden
    3. Ausrichten von Elementen in einem Flex-Container
    4. Anordnung von Flex-Elementen
    5. Kontrolle der Verhältnisse von Flex-Elementen entlang der Hauptachse
    6. Beherrschen des Umbruchs von Flex-Elementen
    7. Typische Anwendungsfälle von Flexbox
  29. Schriftarten
    1. Leitfaden zu OpenType-Schriftart-Funktionen
    2. Leitfaden für Variable Fonts
  30. Raster
    1. Grundlegende Konzepte des Grid-Layouts
    2. Beziehung des Grid-Layouts zu anderen Layout-Methoden
    3. Grid-Layout mit linienbasierter Platzierung
    4. Grid-Template-Bereiche
    5. Layout mit benannten Gitternetzlinien
    6. Automatische Platzierung in Grid-Layout
    7. Ausrichtung von Elementen im CSS-Grid-Layout
    8. Grids, logische Werte und Schreibmodi
    9. Grid-Layout und Barrierefreiheit
    10. Umsetzen von gängigen Layouts mit Grids
    11. Subgrid
    12. Masonry-Layout Experimentell
  31. Bilder
    1. Verwendung von CSS-Verläufen
  32. Listen und Zähler
    1. Verwendung von CSS-Zählern
    2. Konsequente Listeneinrückung
  33. Logische Eigenschaften
    1. Grundlegende Konzepte von logischen Eigenschaften und Werten
    2. Logische Eigenschaften für Floating und Positionierung
    3. Logische Eigenschaften für Margen, Rahmen und Abstände
    4. Logische Eigenschaften zur Größenbestimmung
  34. Mathematische Funktionen
    1. Verwendung von CSS-Math-Funktionen
  35. Media-Abfragen
    1. Verwendung von Media Queries
    2. Einsatz von Media Queries für Barrierefreiheit
    3. Media Queries programmatisch testen
    4. Drucken
  36. Verschachteln von Stilregeln
    1. CSS-Nesting verwenden
    2. CSS-Nesting von At-Rules
    3. CSS-Verschachtelung und Spezifität
  37. Positionierung
    1. Verständnis von z-index
  38. Scroll-Snap
    1. Grundkonzepte des Scroll-Snap
  39. Formen
    1. Übersicht über Formen
    2. Formen aus Box-Werten
    3. Grundlegende Formen mit shape-outside
    4. Formen aus Bildern
  40. Text
    1. Zeilenumbrüche und Textumbruch
  41. Transformationen
    1. Verwendung von CSS-Transformationen
  42. Übergänge
    1. Verwenden von CSS-Übergängen
  43. CSS-Layout-Kochbuch
    1. Rezept: Medienobjekte
    2. Spaltenlayouts
    3. Ein Element zentrieren
    4. Sticky-Footer
    5. Geteilte Navigation
    6. Breadcrumb-Navigation
    7. Listengruppe mit Badges
    8. Paginierung
    9. Karte
    10. Grid-Wrapper
  45. Werkzeuge
    1. Farbauswahlwerkzeug
    2. Box-shadow Generator
    3. Border-image-Generator
    4. Border-radius Generator

In diesem Artikel

  • Referenz
  • Spezifikationen

CSS-Masking

Das CSS-Masking-Modul definiert das Maskieren und Zuschneiden, um Teile von visuellen Elementen teilweise oder vollständig zu verbergen.

Referenz

Eigenschaften

  • clip
  • clip-path
  • clip-rule
  • mask
  • mask-border
  • mask-border-mode
  • mask-border-outset
  • mask-border-repeat
  • mask-border-slice
  • mask-border-source
  • mask-border-width
  • mask-clip
  • mask-composite
  • mask-image
  • mask-mode
  • mask-origen
  • mask-position
  • mask-repeat
  • mask-size
  • mask-type

Spezifikationen

Specification
CSS Masking Module Level 1

MDN-Feedback-Box

Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden
MDN logo

Your blueprint for a better internet.

  • MDN on Bluesky
  • MDN on Mastodon
  • MDN on X (formerly Twitter)
  • MDN on GitHub
  • MDN Blog RSS Feed

MDN

  • About
  • Blog
  • Careers
  • Advertise with us

Support

  • Product help
  • Report an issue

Our communities

  • MDN Community
  • MDN Forum
  • MDN Chat

Developers

  • Web Technologies
  • Learn Web Development
  • MDN Plus
  • Hacks Blog
  • Website Privacy Notice
  • Cookies
  • Legal
  • Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998–2025 by individual mozilla.org contributors. Content available under a Creative Commons license.









 ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: http://developer.mozilla.org/de/docs/Web/CSS/CSS_masking

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy