Introduction

Filters give a great variety of visual effects in web pages dynamically. Image Filters are of three types:
  1. Gray-The Gray Filter applies a grayscale image effect in which all color is stripped from the image and all that remains in brightness data.
  2. Xray-The Xray Filter applies an Xray effect which is just an inversion of the Gray effect.
  3. Invert-The Invert Filter applies a Negative Image effect ie: dark areas become light and light areas become dark.
File name must be given with STYLE attribute as follows:
  1. STYLE="filter:gray"
  2. For example, look at following code snippets:
  3. <Html>
  4. <Body>
  5. <br>
  6. <br>
  7. <table>
  8. <tr>
  9. <td>
  10. <img src="F:\photo.gif" >
  11. </td>
  12. <td>
  13. <img src="F:\photo.gif" STYLE="filter:gray">
  14. </td>
  15. <td>
  16. <img src="F:\photo.gif" STYLE="filter:xray">
  17. </td>
  18. <td>
  19. <img src="F:\photo.gif" STYLE="filter:invert">
  20. </td>
  21. </tr>
  22. <tr align="center"><td>Normal</td>
  23. <td>Gray</td>
  24. <td>XRay</td>
  25. <td>Invert</td>
  26. </tr>
  27. </table>
  28. </Body>
  29. </Html>
Output
1.gif