Pour protéger vos images grâce à un filigrane, il suffit de prévoir de superposer deux images de même taille dont celle du dessous apparaîtra par transparence.
Dans cet exemple, l'Url de l'image définie en background est:
http://img.over-blog-kiwi.com/1/30/51/51/20150411/ob_db1aae_copy.JPG
Quand à l'Url de l'image elle-même, ci-dessous, elle est:
http://img.over-blog-kiwi.com/1/30/51/51/20150410/ob_bcd218_tresse.jpg
CODE
<div style="width:500px; height:500px; border:solid 1px black; padding:10px;
background-image:url(http://img.over-blog-kiwi.com/1/30/51/51/20150411/ob_db1aae_copy.JPG); background-size:cover;">
<div style="background-color:white; padding:4px 10px; opacity:0.9;"><img src="http://img.over-blog-kiwi.com/1/30/51/51/20150410/ob_bcd218_tresse.jpg" /></div>
<div style="background-color:white; padding:0px 0px; opacity:0,7"> </div>
</div>
RESULTAT
Voici maintenant le même exemple avec une image dont le fond est en couleur.
Vous pouvez remarquer que le copyright apparaît de façon parfaite.
Bien entendu, libre à l'imagination d'inventer son propre logo, plus ou moins discret, plus ou moins personnalisé mais c'est cette méthode qui est utilisée par les photogaphes pour rendre leurs photos toujours identifiables.
Le code est un peu différent puisque j'ai supprimé le cadre.
CODE
<div style="width:500px; height:500px; border:solid 0px black; padding:00px;
background-image:url(http://img.over-blog-kiwi.com/1/30/51/51/20150411/ob_db1aae_copy.JPG); background-size:cover;">
<div style="background-color:white; padding:4px 10px; opacity:0.9;"><img src="http://img.over-blog-kiwi.com/1/30/51/51/20150411/ob_913184_mono2.JPG" /></div>
<div style="background-color:white; padding:0px 0px; opacity:0,7"> </div>
</div>
Haut de page
commentaires