Jak - Dodawanie efektów obrazu

Dowiedz się, jak dodać efekty wizualne do zdjęć.

Filtry CSS

CSS filter nieruchomość dodaje efekty wizualne (like blur and saturation) do elementu.

Uwaga: Właściwość filtr nie jest obsługiwany w przeglądarce Internet Explorer, EDGE 12 lub Safari 5.1 i wcześniej.

Przykład skali szarości

Zmienić kolor wszystkich zdjęć do czerni i bieli (100% gray) :

img {
    -webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
    filter: grayscale(100%);
}

Original image

grayscale(100%)

Spróbuj sam "

Przykład plama

Zastosowanie efektu rozmycia wszystkich obrazów:

img {
    -webkit-filter: blur(5px); /* Chrome, Safari, Opera */
    filter: blur(5px);
}

Original image

blur(5px)

Spróbuj sam "

Przejdź do naszego CSS filter Property , aby dowiedzieć się więcej na temat filtrów CSS.