Ajouter l'effet "Filigrane" avec CSS?
J'ai une image dans un div. J'ai besoin d'ajouter un effet de filigrane, ou en fait une autre image, détruisent l'image de la div. Comment puis-je le faire avec du css?
Exemple de code:
<div id="image">
</div>
css:
#image {
background:url(images/images.png) no-repeat;
}
source d'informationauteur HollerTrain
Vous devez vous connecter pour publier un commentaire.
Il y a au moins deux façons de faire, dont l'un a été touché par @erenon de réponse.
Pour répondre à vos exigences et à l'utilisation d'une image:
Avec le code CSS suivant:
Cela devrait générer quelque chose comme ce qui suit:
L'autre façon, en supposant que tout ce que vous voulez filigrane "un mot", c'est d'utiliser mots:
Et le code CSS suivant:
Cela devrait générer quelque chose comme ce qui suit:
Je me rends compte que cette question a probablement répondu à votre satisfaction, mais j'espère que c'est vous qui, même seulement à titre d'information générale.
Êtes-vous sûr que vous voulez faire le filigrane côté client? Faire donc, fondamentalement, défaites le but d'avoir un filigrane. Ce que vous voulez faire est de serveur une image qui contient déjà un filigrane. À le faire, vous aurez à écrire le code côté serveur.
Votre solution:
CSS:
HTML:
Bien meilleure solution:
Certaines personnes n'arrivais pas à briser une superposition en filigrane, mais certaines personnes peuvent. Il est fortement recommandé d'utiliser quelque chose côté serveur filigrane, l'e.g: imagemagick lib.
Vous pouvez éventuellement utiliser une image PNG transparente pour superposer deux images, mais vous ne voulez le faire sur le serveur depuis le client, des solutions sont facilement vaincus et n'a pas vraiment de protéger quoi que ce soit.