Est-il -moz-masque propriété CSS-webkit-masque-image?

Il semble -moz-mask-image n'est pas pris en charge dans Firefox.

Je suis tenter de faire un dégradé de premier plan. Je ne peux pas utiliser une image comme j'ai besoin du texte pour être sélectionnable. Quelqu'un a une idée pour Firefox?

Cette version fonctionne dans chrome et safari

css:

-webkit-mask-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.16, rgba(0,0,0,0)), color-stop(0.52, rgba(0,0,0,.5)), color-stop(0.77, rgba(0,0,0,1)));

-moz-mask: -moz-gradient(linear, left bottom, left top, color-stop(0.16, rgba(0,0,0,0)), color-stop(0.52, rgba(0,0,0,.5)), color-stop(0.77, rgba(0,0,0,1)));
Est votre fond d'une couleur unie? Vous pouvez placer un pseudo-élément sur le dessus du texte de la transparence à la couleur d'arrière-plan.
Salut Duopixel - ouais, j'ai essayé ceci, mais il en résulte ne peut pas être sélectionnée texte.
ajouter pointer-events: none; à l'élément de pente.
parfait, merci pour les conseils.
J'ai voyagé de pour annoncer que mask-image est enfin pris en charge dans Firefox 53. Hourra!

OriginalL'auteur MALK | 2011-12-07

  1. 4

    Selon le MDN, vous pouvez simplement utiliser mask pour Firefox, Firefox 3.5:

    Cependant, mask nécessite une image SVG, pour agir en tant que masque. Vous pourriez être en mesure de base-64 encoder votre image SVG dans votre feuille de style, ou vous pouvez utiliser une image SVG fichier.

    Sauf que vous ne pouvez pas l'utiliser avec gradient, vous devez vous l'utilisation de SVG à la place.
    Aha, oui, je vois.

    OriginalL'auteur Paul D. Waite