• 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

      Learn to make the web accessible to 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

  • 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. Technologies web pour développeurs
  2. CSS : Feuilles de style en cascade
  3. Compositing and Blending
    • English (US)
    • Deutsch
    • 日本語
    • 한국어

Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez également contribuer en rejoignant la communauté francophone sur MDN Web Docs.

Dans cet article

  • Référence
  • Spécifications
  • Compatibilité des navigateurs
  1. CSS
  2. Beginner's tutorials
  3. Your first website: Styling the content
  4. CSS styling basics
    1. Qu'est-ce que CSS ?
    2. Démarrer avec CSS
    3. Mettre en œuvre vos connaissances
    4. Sélecteurs de type, de classe et d'ID
    5. Sélecteurs d'attribut
    6. Pseudo-classes et pseudo-éléments
    7. Combinateurs
    8. Le modèle de boîte
    9. Cascade, spécificité et héritage
    10. Valeurs et unités CSS
    11. Définir la taille des éléments en CSS
    12. Arrière-plans et bordures
    13. Débordements de contenu (overflow)
    14. Images, media, and form elements
    15. Mise en forme des tableaux
    16. Déboguer du code CSS
    17. Compréhension des fondements des CSS
    18. Création d'un en-tête de papier à lettre élégant
    19. Une boîte d'aspect rafraîchissant
  5. CSS text styling
    1. Initiation à la mise en forme du texte
    2. Style de listes
    3. Mise en forme des liens
    4. Fontes Web
    5. Composition de la page d'accueil d'une école de communauté
  6. Dispositions CSS
    1. Introduction à la mise en page en CSS
    2. Les boîtes flottantes
    3. Le positionnement
    4. Flexbox
    5. Grilles
    6. Responsive design
    7. Media query fundamentals
    8. Compréhension fondamentale de la mise en page
  7. Référence CSS
  8. Modules
    1. CSS anchor positioning
    2. Les animations CSS
    3. Arrière-plans et bordures CSS (CSS backgrounds and borders)
    4. CSS Basic User Interface
    5. CSS Box Alignment
    6. Modèle de boîte
    7. CSS box sizing
    8. CSS cascade and inheritance
    9. CSS color adjustment
    10. CSS Color
    11. Compositing and Blending
    12. CSS Conditional Rules
    13. Compartimentation CSS (CSS Containment)
    14. CSS Counter Styles
    15. CSS Custom Properties for Cascading Variables
    16. CSS Display
    17. Filter Effects
    18. Disposition des boîtes flexibles CSS
    19. CSS font loading
    20. CSS Fonts
    21. CSS Fragmentation
    22. CSS Generated Content
    23. Grilles CSS (CSS Grid)
    24. CSS Images
    25. CSS inline layout
    26. CSS Lists
    27. CSS Logical Properties
    28. CSS Masks
    29. Requêtes média CSS (media queries)
    30. Motion Path
    31. Colonnes CSS
    32. CSS Namespaces
    33. CSS nesting
    34. CSS Overflow
    35. CSS overscroll behavior
    36. CSS Pages
    37. CSS Positioned Layout
    38. CSS properties and values API
    39. CSS pseudo-elements
    40. CSS Ruby
    41. CSS scoping
    42. CSS Scroll Snap
    43. CSS scroll-driven animations
    44. CSS Scrollbars
    45. Sélecteurs CSS
    46. CSS shadow parts
    47. CSS Shapes
    48. Jeux de caractères CSS
    49. CSS Table
    50. CSS Text
    51. CSS Text Decoration
    52. CSS Transforms
    53. Transitions CSS
    54. CSS view transitions
    55. CSS Writing Modes
    56. CSSOM View
  9. Properties
    1. -moz-*
      1. -moz-float-edge Non standard Obsolète
      2. -moz-force-broken-image-icon Non standard Obsolète
      3. -moz-image-region Non standard
      4. -moz-orient Non standard
      5. -moz-user-focus Non standard Obsolète
      6. -moz-user-input Non standard Obsolète
    2. -webkit-*
      1. -webkit-border-before Non standard
      2. -webkit-box-reflect Non standard
      3. -webkit-line-clamp
      4. -webkit-mask-box-image Non standard
      5. -webkit-mask-composite Non standard
      6. -webkit-mask-position-x Non standard
      7. -webkit-mask-position-y Non standard
      8. -webkit-mask-repeat-x Non standard
      9. -webkit-mask-repeat-y Non standard
      10. -webkit-tap-highlight-color Non standard
      11. -webkit-text-fill-color
      12. -webkit-text-security Non standard
      13. -webkit-text-stroke
      14. -webkit-text-stroke-color
      15. -webkit-text-stroke-width
      16. -webkit-touch-callout Non standard
    3. accent-color
    4. align-*
      1. align-content
      2. align-items
      3. align-self
    5. all
    6. anchor-name Expérimental
    7. 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 Expérimental
      11. animation-range-end Expérimental
      12. animation-range-start Expérimental
      13. animation-timeline Expérimental
      14. animation-timing-function
    8. appearance (-moz-appearance, -webkit-appearance)
    9. aspect-ratio
    10. backdrop-filter
    11. backface-visibility
    12. background-*
      1. background
      2. background-attachment
      3. background-blend-mode
      4. background-clip
      5. background-color
      6. background-image
      7. background-origin
      8. background-position
      9. background-position-x
      10. background-position-y
      11. background-repeat
      12. background-size
    13. block-size
    14. 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
    15. bottom
    16. box-*
      1. box-align Non standard Obsolète
      2. box-decoration-break
      3. box-direction Non standard Obsolète
      4. box-flex Non standard Obsolète
      5. box-flex-group Non standard Obsolète
      6. box-lines Non standard Obsolète
      7. box-ordinal-group Non standard Obsolète
      8. box-orient Non standard Obsolète
      9. box-pack Non standard Obsolète
      10. box-shadow
      11. box-sizing
    17. break-*
      1. break-after
      2. break-before
      3. break-inside
    18. caption-side
    19. caret-color
    20. clear
    21. clip-*
      1. clip Obsolète
      2. clip-path
      3. clip-rule
    22. color-*
      1. color
      2. color-interpolation
      3. color-interpolation-filters
      4. color-scheme
    23. column-*
      1. column-count
      2. column-fill
      3. column-gap (grid-column-gap)
      4. column-rule
      5. column-rule-color
      6. column-rule-style
      7. column-rule-width
      8. column-span
      9. column-width
    24. columns
    25. 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
    26. container-*
      1. container
      2. container-name
      3. container-type
    27. content
    28. content-visibility
    29. counter-*
      1. counter-increment
      2. counter-reset
      3. counter-set
    30. cursor
    31. cx
    32. cy
    33. d
    34. direction
    35. display
    36. dominant-baseline
    37. empty-cells
    38. field-sizing Expérimental
    39. fill-*
      1. fill
      2. fill-opacity
      3. fill-rule
    40. filter
    41. flex-*
      1. flex
      2. flex-basis
      3. flex-direction
      4. flex-flow
      5. flex-grow
      6. flex-shrink
      7. flex-wrap
    42. float
    43. flood-color
    44. flood-opacity
    45. 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 Non standard
      11. font-stretch
      12. font-style
      13. font-synthesis
      14. font-synthesis-position Expérimental
      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
    46. forced-color-adjust
    47. gap (grid-gap)
    48. 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
    49. hanging-punctuation
    50. height
    51. hyphenate-character
    52. hyphenate-limit-chars
    53. hyphens
    54. image-*
      1. image-orientation
      2. image-rendering
      3. image-resolution Expérimental
    55. initial-letter
    56. inline-size
    57. 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
    58. interpolate-size Expérimental
    59. isolation
    60. justify-*
      1. justify-content
      2. justify-items
      3. justify-self
    61. left
    62. letter-spacing
    63. lighting-color
    64. line-*
      1. line-break
      2. line-height
      3. line-height-step Expérimental
    65. list-*
      1. list-style
      2. list-style-image
      3. list-style-position
      4. list-style-type
    66. 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 Expérimental
    67. marker-*
      1. marker
      2. marker-end
      3. marker-mid
      4. marker-start
    68. 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-origin
      14. mask-position
      15. mask-repeat
      16. mask-size
      17. mask-type
    69. math-*
      1. math-depth
      2. math-shift Expérimental
      3. math-style
    70. max-*
      1. max-block-size
      2. max-height
      3. max-inline-size
      4. max-width
    71. min-*
      1. min-block-size
      2. min-height
      3. min-inline-size
      4. min-width
    72. mix-blend-mode
    73. object-fit
    74. object-position
    75. offset-*
      1. offset
      2. offset-anchor
      3. offset-distance
      4. offset-path
      5. offset-position
      6. offset-rotate
    76. opacity
    77. order
    78. orphans
    79. outline-*
      1. outline
      2. outline-color
      3. outline-offset
      4. outline-style
      5. outline-width
    80. 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
    81. overlay Expérimental
    82. overscroll-*
      1. overscroll-behavior
      2. overscroll-behavior-block
      3. overscroll-behavior-inline
      4. overscroll-behavior-x
      5. overscroll-behavior-y
    83. 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
    84. page-*
      1. page
      2. page-break-after
      3. page-break-before
      4. page-break-inside
    85. paint-order
    86. perspective
    87. perspective-origin
    88. place-*
      1. place-content
      2. place-items
      3. place-self
    89. pointer-events
    90. position-*
      1. position
      2. position-anchor Expérimental
      3. position-area Expérimental
      4. position-try Expérimental
      5. position-try-fallbacks Expérimental
      6. position-try-order Expérimental
      7. position-visibility Expérimental
    91. print-color-adjust
    92. quotes
    93. r
    94. resize
    95. right
    96. rotate
    97. row-gap (grid-row-gap)
    98. ruby-align
    99. ruby-position
    100. rx
    101. ry
    102. scale
    103. 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 Expérimental
      28. scroll-timeline-axis Expérimental
      29. scroll-timeline-name Expérimental
    104. scrollbar-*
      1. scrollbar-color
      2. scrollbar-gutter
      3. scrollbar-width
    105. shape-*
      1. shape-image-threshold
      2. shape-margin
      3. shape-outside
      4. shape-rendering
    106. stop-color
    107. stop-opacity
    108. stroke-*
      1. stroke
      2. stroke-dasharray
      3. stroke-dashoffset
      4. stroke-linecap
      5. stroke-linejoin
      6. stroke-miterlimit
      7. stroke-opacity
      8. stroke-width
    109. tab-size
    110. table-layout
    111. text-*
      1. text-align
      2. text-align-last
      3. text-anchor
      4. text-combine-upright
      5. text-decoration
      6. text-decoration-color
      7. text-decoration-line
      8. text-decoration-skip Expérimental
      9. text-decoration-skip-ink
      10. text-decoration-style
      11. text-decoration-thickness
      12. text-emphasis
      13. text-emphasis-color
      14. text-emphasis-position
      15. text-emphasis-style
      16. text-indent
      17. text-justify
      18. text-orientation
      19. text-overflow
      20. text-rendering
      21. text-shadow
      22. text-size-adjust Expérimental
      23. text-spacing-trim Expérimental
      24. text-transform
      25. text-underline-offset
      26. text-underline-position
      27. text-wrap
      28. text-wrap-mode
      29. text-wrap-style
    112. timeline-scope Expérimental
    113. top
    114. touch-action
    115. transform-*
      1. transform
      2. transform-box
      3. transform-origin
      4. transform-style
    116. transition-*
      1. transition
      2. transition-behavior
      3. transition-delay
      4. transition-duration
      5. transition-property
      6. transition-timing-function
    117. translate
    118. unicode-bidi
    119. user-modify Non standard Obsolète
    120. user-select
    121. vector-effect
    122. vertical-align
    123. view-*
      1. view-timeline Expérimental
      2. view-timeline-axis Expérimental
      3. view-timeline-inset Expérimental
      4. view-timeline-name Expérimental
      5. view-transition-name
    124. visibility
    125. white-space
    126. white-space-collapse
    127. widows
    128. width
    129. will-change
    130. word-break
    131. word-spacing
    132. writing-mode
    133. x
    134. y
    135. z-index
    136. zoom
  10. Selectors
    1. & nesting selector
    2. Sélecteurs d'attribut
    3. Sélecteurs de classe
    4. Sélecteurs d'ID
    5. Sélecteurs de type
    6. Sélecteurs universels
  11. Combinators
    1. Sélecteurs enfant
    2. Combinateur de colonne Expérimental
    3. Sélecteurs descendant
    4. Namespace separator
    5. Combinateur de voisins directs
    6. Liste de sélecteurs
    7. Combinateur de voisins suivants
  12. Pseudo-classes
    1. :-moz-broken Non standard Obsolète
    2. :-moz-drag-over Non standard
    3. :-moz-first-node Expérimental Non standard
    4. :-moz-handler-blocked Non standard
    5. :-moz-handler-crashed Non standard
    6. :-moz-handler-disabled Non standard
    7. :-moz-last-node Expérimental Non standard
    8. :-moz-loading Non standard
    9. :-moz-locale-dir(ltr) Non standard
    10. :-moz-locale-dir(rtl) Non standard
    11. :-moz-only-whitespace Non standard
    12. :-moz-submit-invalid Non standard
    13. :-moz-suppressed Non standard
    14. :-moz-user-disabled Non standard
    15. :-moz-window-inactive Non standard
    16. :active
    17. :any-link
    18. :-webkit-autofill
    19. :blank Expérimental
    20. :buffering
    21. :checked
    22. :current Expérimental
    23. :default
    24. :defined
    25. :dir()
    26. :disabled
    27. :empty
    28. :enabled
    29. :first
    30. :first-child
    31. :first-of-type
    32. :focus
    33. :focus-visible
    34. :focus-within
    35. :fullscreen
    36. :future
    37. :has-slotted Expérimental
    38. :has
    39. :host
    40. :host-context()
    41. :host()
    42. :hover
    43. :in-range
    44. :indeterminate
    45. :invalid
    46. :is()
    47. :lang
    48. :last-child
    49. :last-of-type
    50. :left
    51. :link
    52. :local-link Expérimental
    53. :modal
    54. :muted
    55. :not
    56. :nth-child
    57. :nth-last-child
    58. :nth-last-of-type
    59. :nth-of-type
    60. :only-child
    61. :only-of-type
    62. :optional
    63. :out-of-range
    64. :past
    65. :paused
    66. :picture-in-picture
    67. :placeholder-shown
    68. :playing
    69. :popover-open
    70. :read-only
    71. :read-write
    72. :required
    73. :right
    74. :root
    75. :scope
    76. :seeking
    77. :stalled
    78. :state()
    79. :target
    80. :target-within Expérimental
    81. :-moz-ui-invalid
    82. :user-valid (:-moz-ui-valid)
    83. :valid
    84. :visited
    85. :volume-locked
    86. :where()
  13. Pseudo-elements
    1. ::-moz-color-swatch Non standard
    2. ::-moz-focus-inner Expérimental Non standard
    3. ::-moz-list-bullet Expérimental Non standard
    4. ::-moz-list-number Expérimental Non standard
    5. ::-moz-meter-bar Non standard
    6. ::-moz-progress-bar Expérimental Non standard
    7. ::-moz-range-progress Non standard
    8. ::-moz-range-thumb Non standard
    9. ::-moz-range-track Non standard
    10. ::-webkit-inner-spin-button Non standard
    11. ::-webkit-meter-bar Non standard Obsolète
    12. ::-webkit-meter-even-less-good-value Non standard
    13. ::-webkit-meter-inner-element Non standard
    14. ::-webkit-meter-optimum-value Non standard
    15. ::-webkit-meter-suboptimum-value Non standard
    16. ::-webkit-progress-bar Non standard
    17. ::-webkit-progress-inner-element Non standard
    18. ::-webkit-progress-value Non standard
    19. ::-webkit-scrollbar Non standard
    20. ::-webkit-search-cancel-button Non standard
    21. ::-webkit-search-results-button Non standard
    22. ::-webkit-slider-runnable-track Expérimental Non standard
    23. ::-webkit-slider-thumb Expérimental Non standard
    24. ::after
    25. ::backdrop
    26. ::before (:before)
    27. ::cue
    28. ::-webkit-file-upload-button
    29. ::first-letter
    30. ::first-line (:first-line)
    31. ::grammar-error
    32. ::highlight()
    33. ::marker
    34. ::part()
    35. ::placeholder
    36. ::selection
    37. ::slotted()
    38. ::spelling-error
    39. ::target-text
    40. ::view-transition
    41. ::view-transition-group
    42. ::view-transition-image-pair
    43. ::view-transition-new
    44. ::view-transition-old
  14. At-rules
    1. @charset
    2. @color-profile
    3. @container
    4. @counter-style
    5. @document Non standard Obsolète
    6. @font-face
    7. @font-feature-values
    8. @font-palette-values
    9. @import
    10. @keyframes
    11. @layer
    12. @media
    13. @namespace
    14. @page
    15. @position-try Expérimental
    16. @property
    17. @scope
    18. @starting-style
    19. @supports
    20. @view-transition
  15. Functions
    1. -moz-image-rect Non standard Obsolète
    2. abs()
    3. acos()
    4. anchor-size() Expérimental
    5. anchor() Expérimental
    6. asin()
    7. atan()
    8. atan2()
    9. attr()
    10. calc-size() Expérimental
    11. calc
    12. clamp()
    13. cos()
    14. counter()
    15. counters()
    16. cross-fade()
    17. element Expérimental
    18. env()
    19. exp()
    20. fit-content()
    21. hypot()
    22. log()
    23. max()
    24. min()
    25. minmax()
    26. mod()
    27. pow()
    28. ray()
    29. rem()
    30. repeat()
    31. round()
    32. sign()
    33. sin()
    34. sqrt()
    35. symbols()
    36. tan()
    37. url()
    38. var()
  16. Types
    1. <absolute-size>
    2. alpha-value
    3. <angle-percentage>
    4. <angle>
    5. <basic-shape>
    6. <blend-mode>
    7. <box-edge>
    8. <calc-keyword>
    9. <calc-sum>
    10. <color-interpolation-method>
    11. <color>
    12. <custom-ident>
    13. <dashed-ident>
    14. <dimension>
    15. <display-box>
    16. display-inside
    17. <display-internal>
    18. <display-legacy>
    19. <display-listitem>
    20. display-outside
    21. <easing-function>
    22. <filter-function>
    23. <flex>
    24. <frequency-percentage>
    25. <frequency>
    26. <generic-family>
    27. <gradient>
    28. <hex-color>
    29. <hue-interpolation-method>
    30. <hue>
    31. <ident>
    32. <image>
    33. <integer>
    34. <length-percentage>
    35. <length>
    36. <line-style>
    37. <named-color>
    38. <number>
    39. <overflow>
    40. <percentage>
    41. <position-area> Expérimental
    42. <position>
    43. <ratio>
    44. <relative-size>
    45. <resolution>
    46. <shape> Obsolète
    47. <string>
    48. <system-color>
    49. <time-percentage>
    50. <time>
    51. transform-function
    52. url()
  17. Guides
  18. Animations
    1. Utiliser les animations CSS
  19. Arrière-plans et bordures
    1. Utiliser plusieurs arrière-plans
    2. Redimensionner les images d'arrière-plan
  20. Box alignment
    1. Alignement des boîtes avec la disposition en bloc
    2. L'alignement des boîtes avec Flexbox
    3. L'alignement des boîtes avec une grille CSS
    4. L'alignement des boîtes avec une disposition en colonnes
  21. Modèle de boîte
    1. Introduction to the CSS basic box model
    2. Fusion des marges
  22. Colors
    1. Applying_color_to_HTML_elements
    2. Color values
    3. Using relative colors
    4. Using color wisely
    5. Accessibility_Understanding_colors_and_luminance"
    6. Accessibility: Color contrast
  23. Colonnes
    1. Concepts de base pour la disposition multi-colonnes
    2. Mettre en forme les colonnes
    3. Répartir et équilibrer le contenu entre les colonnes
    4. Gestion du dépassement en multi-colonnes
    5. Gérer la rupture du contenu entre les colonnes
  24. Règles conditionnelles
    1. Utiliser les requêtes de fonctionnalité (feature queries)
  25. Containment
    1. Using CSS containment
    2. CSS container queries
    3. Using container size and style queries
  26. Vue CSSOM
    1. Systèmes de coordonnées
  27. Boîtes flexibles
    1. Les concepts de base pour flexbox
    2. Les liens entre flexbox et les autres méthodes de disposition
    3. Aligner des éléments dans un conteneur flexible
    4. Ordonner les éléments flexibles
    5. Contrôler les proportions des boîtes flexibles le long de l'axe principal
    6. Maîtriser le passage à la ligne des éléments flexibles
    7. Cas d'utilisation classiques de flexbox
  28. Disposition de flux
    1. Disposition de bloc et en ligne avec le flux normal
    2. Être ou ne pas être dans le flux
    3. Explications quant aux contextes de formatage
    4. Disposition de flux et modes d'écriture
    5. La disposition en flux et le dépassement
  29. Polices
    1. Guide des caractéristiques de police OpenType
    2. Guide des polices variables
  30. Grille
    1. Les concepts de base des grilles CSS
    2. Le modèle de grille et les autres modèles de disposition
    3. Placer les éléments sur les lignes d'une grille CSS
    4. Définir des zones sur une grille
    5. Utiliser des lignes nommées sur une grille
    6. Le placement automatique sur une grille CSS
    7. L'alignement des boîtes avec les grilles CSS
    8. Les grilles CSS, les valeurs logiques et les modes d'écriture
    9. Les grilles CSS et l'accessibilité
    10. Les grilles CSS et l'amélioration progressive
    11. Construire des dispositions courantes avec des grilles CSS
    12. Subgrid
    13. align-tracks Expérimental
  31. Images
    1. Utilisation de dégradés CSS
  32. Listes et compteurs
    1. Compteurs CSS
    2. Indentation homogène des listes
  33. Propriétés logiques
    1. Concepts de base des propriétés et valeurs logiques
    2. Propriétés logiques pour les flottements et le positionnement
    3. Propriétés logiques pour les marges, les bordures et les remplissages
    4. Propriétés logiques pour le dimensionnement
  34. Math functions
    1. Using CSS math functions
  35. Requêtes média
    1. Media queries
    2. Utilisation des requêtes média pour l'accessibilité
    3. Tester les requêtes média en JavaScript
    4. Printing
  36. Nesting style rules
    1. Using CSS nesting
    2. CSS nesting at-rules
    3. CSS nesting and specificity
  37. Positionnement
    1. Comprendre z-index en CSS
  38. Ancrage du défilement
    1. Concepts de bases pour CSS Scroll Snap
  39. Formes
    1. Aperçu des formes CSS
    2. Créer des formes à partir des boîtes
    3. Formes simples
    4. Générer des formes avec des images
  40. Texte
    1. Wrapping and breaking text
  41. Transformations
    1. Utilisation des transformations CSS
  42. Transitions
    1. Utiliser les transitions CSS
  43. CSS Layout cookbook
    1. Objets avec média
    2. Disposition en colonnes
    3. Centrer un élément
    4. Bas de page adhérant
    5. Navigation segmentée
    6. Fil d'Ariane (breadcrumb)
    7. Liste de groupes avec indicateurs
    8. Pagination
    9. Carte
    10. Envelopper une grille
  45. Outils
    1. Color picker tool
    2. Générateur de box-shadow
    3. Générateur de border-image
    4. Générateur de border-radius

Dans cet article

  • Référence
  • Spécifications
  • Compatibilité des navigateurs

Compositing and Blending

Compositing and Blending (Composition et fusion) est un module de la spécification CSS qui définit la façon dont les formes de différents éléments sont combinés afin de former une seule image.

Référence

Propriétés

  • background-blend-mode
  • isolation
  • mix-blend-mode

Types de donnée

  • <blend-mode>

Spécifications

Specification
Compositing and Blending Level 2
Compositing and Blending Level 1

Compatibilité des navigateurs

Help improve MDN

Learn how to contribute.

This page was last modified on 3 août 2023 by MDN contributors.

View this page on GitHub • Report a problem with this content
MDN logo

Your blueprint for a better internet.

  • 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
Mozilla logo
  • 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–2024 by individual mozilla.org contributors. Content available under a Creative Commons license.