Фільтри в css

none - Значення за замовчуванням. Чи не вказує, ніяких ефектів

blur (px) - До зображення застосовується ефект розмиття. Більше значення буде створювати більше розмиття .По замовчуванням используеться значення 0.

Фільтри в css

brightness (%) - Регулювання яскравості зображення .0% робить зображення повністю чорним .100% є за замовчуванням і є вихідне ізображеніе.Значенія понад 100% забезпечить більш яскраві результати.

Фільтри в css

contrast (%) - Регулювання контрастності ізображенія.0% робить зображення повністю черним.100% є за замовчуванням і є вихідне зображення. Значення більше 100% забезпечить результати з меншою кількістю контрасту.

Фільтри в css

drop-shadow (h-shadow v-shadow blur spread color) - застосування ефекту тіні до зображення.

Можливі значення:
  • h-shadow - Обов'язково. Задає значення пікселя для горизонтальної тіні. Негативні значення помістити тінь зліва від зображення.
  • v-shadow - Обов'язково. Задає значення пікселя для вертикальної тіні. Негативні значення помістіть тінь над зображенням.
  • blur - необов'язково. Це третє значення, і має бути в пікселях. Додає ефект розмиття тіні. Більше значення буде створювати більше розмиття (тінь стає більше і світліше). Негативні значення не допускаються. Якщо не вказано значення, використовується 0 (край тіньової є різке).
  • spread - Необов'язково. Це четверте значення, і має бути в пікселях. Позитивні значення змусить тінь розширюватися і рости більше, а негативні значення призведе тінь скорочуватися. Якщо не вказано, то буде 0 (тінь буде мати той же розмір, як елемент).
  • color - необов'язково. Додає колір тіні. Якщо не вказано, колір залежить від браузера (часто чорного кольору).

    Фільтри в css

    grayscale (%) - Перетворення зображення у відтінках серого.0% за замовчуванням. і являє собою вихідне ізображеніе.100% зробить зображення повністю сірий (використовується для чорно-білих зображень).

    Фільтри в css

    hue-rotate (deg) - Застосовується поворот колірного тону на зображенні. Значення визначає скільки градусів навколо колірного кола буде скоректований. 0deg за замовчуванням. і являє собою оригінальне зображення.

    Фільтри в css

    invert (%) - інвертуйте зразки в ізображеніі.0 за замовчуванням. і являє собою вихідне зображення .100% зробить зображення повністю перевернутої.

    Фільтри в css

    opacity (%) Встановлює рівень непрозорості для ізображенія.0% є повністю прозорим. 100% є за замовчуванням і є вихідне зображення (без прозорості).

    Фільтри в css

    saturate (%) - Насичує зображення .0% зробить зображення не - насищеннимі.100% за замовчуванням і є вихідне ізображеніе.Значенія понад 100% забезпечує супер - насичені результати.

    Фільтри в css

    sepia (%) - Перетворює зображення в сепіі.0% за замовчуванням. і являє собою вихідне зображення. 100% робить зображення повністю сепією.

    Фільтри в css

    Якщо хочете використовувати кілька фільтрів, треба кожен фільтр відокремити прогалиною.

    Схожі статті