CSS:-moz-image-region

Un article de MDC.

« Référence CSS « Référence CSS:Extensions Mozilla

[modifier] Résumé

Por certains éléments et pseudo-éléments XUL, qui utilisent une image de la propriété list-style-image, cette propriété définit la portion de l'image à utiliser à la place de l'image entière. Cela permet d'utiliser plusieurs morceaux d'un même image pour améliorer les performances.

La syntaxe est similaire à celle de la propriété clip. Les quatre valeurs sont relatives au coin supérieur gauche de l'image.

• Valeur initiale : auto
• S'applique à : éléments XUL image et :-moz-tree-image, :-moz-tree-twisty, et les pseudo-éléments :-moz-tree-checkbox
• Héritée : oui
• Pourcentages: N/A
• Valeur calculée : Pour les valeurs de rect(), un rectangle étant constitué de quatre longueurs calculées ; autrement, comme spécifié.

[modifier] Syntaxe

-moz-image-region: rect(top, right, bottom, left);

[modifier] Exemples

#example-button {
  /* display only the 4x4 area from the top left of this image */
  list-style-image: url("chrome://example/skin/example.png");
  -moz-image-region: rect(0px, 4px, 4px, 0px);
}

#example-button:hover {
  /* use the 4x4 area to the right of the first for the hovered button */
  -moz-image-region: rect(0px, 8px, 4px, 4px);
}