Message des administrateurs

Ce blog est le prolongement, le complément du Groupe d'aide Blogger en français. Vous pourrez y trouver, au fur et à mesure qu'ils seront reproduits ici, les conseils donnés au fil des messages sur le Groupe. C'est une simplification pour vos recherches d'aide sur les blogs de Blogger. Vous êtes cordialement invités à participer à cette compilation. Pour ce faire, il vous suffit de m'adresser un mail à cette adresse et dans les meilleurs délais, nous nous efforcerons de changer votre inscription afin que vous puissiez intervenir. Comme il s'agit d'un blog, vous pourrez également laisser vos commentaires - toujours les bienvenus - pour améliorer tant le contenu que le contenant.


Groupe d'aide Blogger en français

Google Groupes
Abonnez-vous au groupe Aide Nouveau Blogger en français
E-mail :
Visiter le groupe

lundi 23 juin 2008

Un filtre de couleur pour ses photos noir blanc

En complément de l'article Opacité et transparence - Appliquer un filtre, une petite astuce pour appliquer un filtre de couleur à ses photos noir blanc.

Rappelons que le taux d'opacité varie de 0 à 100 sous Internet Explorer et de 0.0 à 1.0 sous Firefox. Une opacité de 80% filtre 20% de lumière.

1. L'image de base

Utilisons l'image de base comme fond d'un bloc div :



<div
style="width: 240px; height: 207px;
background-image: url(URL image de base)">
</div>



240px et 207px étant les dimensions de l'image originale. On obtient :






2. L'application du filtre

Sous Internet Explorer, il faut appliquer un filtre alpha, et utiliser l'instruction opacity sous Firefox



<div
style="width: 240px; height: 207px; filter:alpha(opacity=80);opacity:.80;
background-image: url(URL image de base)"></div>








3. La source de couleur

Créons la source de couleur avec un bloc div de la taille de la photo, de couleur rouge orangé (orangered - #ff4500)






Ce bloc source va servir de conteneur à l'image de base, ce qui donne comme code :



<div style="width: 240px; background-color: #ff4500; margin: auto;">
<div style="width: 240px; height: 207px;
filter:alpha(opacity=80);opacity:.80;
background-image: url(URL image de base)"></div>
</div>



Et le résultat, la photo en sépia :




La même photo, en utilisant le vert (#007700) comme source de couleur :







Enregistrer un commentaire