Filter (proprit CSS)  

Applique un filtre graphique un lment (le plus souvent une image).

Voir aussi la proprit Opacity pour les navigateurs autres que Internet Explorer.

Valeurs pour Filter.

FlipVSymtrie verticale de l'image.
FlipHSymtrie horizontale de l'image.
GrayProvoque une restitution en nuances de gris.
InvertProvoque une inversion des couleurs (effet de ngatif).
XRayEffet de rayons X.
Glow(...)Ajoute un halo autour des contours.
Mask(...)Cre un pochoir partir de l'image.
Shadow(...)Ajoute une ombre.
DropShadow(...)Ajoute un cho.
Blur(...)Ajoute un effet de flou.
Wave(...)Ondule l'image ou le texte.
Alpha(...)Gre la transparence.

Exemples.

Les effets peuvent s'appliquer sur des images ou sur du texte.
La proprit Width doit souvent tre dfinie pour un bon rendu.
N'oubliez pas que la proprit Filter n'est reconnue que par Internet Explorer.

Filter: FilpV;

 

Ecclsiastique ou corsaire ?

Filter: FilpH;

 

Lapin ou canard ?

Filter: Gray;

 

Filter: Invert;

 

Filter: XRay;

 

Filter: Glow(Color=Red, Strength=1);

 

Effet sur le texte

Filter: Mask(Color=Blue);

 

Effet sur le texte

Filter: Shadow(
    Color=Gray,
    Direction=135);

 

Texte ombr

Filter: DropShadow(
    Color=Gray,
    OffX=5, OffY=5,
    Positive=1);

 

Texte ombr

Filter: Blur(Add=0, Direction=225, Strength=10);

 

Tout ceci n'est pas clair

Filter: Wave(Add=0, Freq=3, LightStrength=20, Phase=220, Strength=10);

 

Plus fort que l'italique

Sur les images suivantes, le filtre Alpha a t appliqu avec chaque fois des paramtres diffrents. Voici la syntaxe gnrale du filtre Alpha

Filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, StartX=100, Starty=100, FinishX=0, FinishY=0 )

Original

TEXTE

Opacity=50

TEXTE

Opacity=10

TEXTE

Style=1
StartX=100
StartY=100
FinishX=0
FinishY=0

TEXTE

Style=1
StartX=0
StartY=100
FinishX=100
FinishY=0

TEXTE

Style=1
StartX=0
StartY=0
FinishX=100
FinishY=100

TEXTE

Style=2
StartX=100
StartY=0
FinishX=0
FinishY=100

TEXTE

Style=2

TEXTE

Style=3

TEXTE

Pour toute utilisation des informations de cette page, reportez vous au copyright