filter
Vlastnost filter poskytuje visuální efekty jako např. rozmazání a nasycení pro element - většinou obrázky
filter hodnoty:
- blur(px) - rozmazání
- brightness(%) - upravuje jas obrázku
- contrast(%) - upravuje kontrast obrázku
- drop-shadow(h-shadow v-shadow blur spread color) - aplikuje drop shadow efekt na obrázek
- grayscale(%) - aplikuje šedo bílý filtr na obrázek
- hue-rotate(deg) - upravuje odstíny obrázku
- invert(%) - invertuje obrázek
- opacity(%) - aplikuje průhlednost pro obrázek
- saturate(%) - nasycení pro obrázek
- sepia(%) - aplikuje sepia efekt
- url() - URL na XML soubor, který specifikuje SVG filter
Editor
Pro živou ukázku je CSS a JavaScript vepsaný přímo v dokumentu - v praxi tyto soubory vždy oddělujte do externích souborů
<!DOCTYPE html>
<html>
<head>
<style>
img {
filter: blur(5px);
}
</style>
</head>
<body>
<img src="../../res/img/icon.png" alt="icon.png" width="200" height="200">
</body>
</html>