Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

CSS - Propriété mask-origin

Description de la propriété mask-origin.

mask-origin est une propriété expérimentale. Avant de l'utiliser, vérifier sa compatibilité avec les navigateurs actuels, et utilisez éventuellement les préfixes spécifiques à chaque navigateur (-moz-, -webkit-, etc.).

La propriété mask-origin définit la référence utilisée pour positionner le masque. En gros, le positionnement se fait-il par rapport au contenu de l'élément, sa bordure ou ses marges ?
La propriété mask-position définit la position du masque par rapport à cette référence.

Pour des explications plus complète sur le masquage, reportez-vous à la propriété raccourcie mask.

Valeurs pour mask-origin.

  • mask-origin: content-box;

    La position du masque est déterminée par rapport au contenu de l'élément.

  • mask-origin: padding-box;

    Le masque est positionné par rapport à la marge intérieure (padding) de l'élément.

  • mask-origin: border-box;

    Le masque est positionné par rapport à la bordure de l'élément.

  • mask-origin: fill-box; mask-origin: stroke-box; mask-origin: view-box;

    Ces trois valeurs sont applicables aux éléments du type SVG.

  • mask-origin: initial;

    La valeur initiale est auto.

  • mask-origin: unset; mask-origin: inherit;

    Reportez-vous à la description générale de ces valeurs.

Simulateur.

Attention ! Votre navigateur ne prend pas en charge le masquage des éléments.
mask-origin :
Margin Border Padding Content

Prise en charge par les navigateurs (compatibilité).

Afficher les versions antérieures   Afficher la version à venir  

Voir aussi...

Masquage - Propriétés.

  • mask : Résumé des paramètres de masquage.
  • mask-clip : Zone concernée par le masquage.
  • mask-image : Image ou le fichier SVG qui sera utilisé comme masque
  • mask-mode : Mode de masquage (couche alpha, luminance...)
  • mask-position : Position du masque.
  • mask-repeat : Mode de répétition du masque si celui-ci est plus petit que l'élément à masquer.
  • mask-size : Dimensions du masque.