CSS texnologiyasında 8 faydalı həllər barədə olan məqalə seriyasına davam edirik.

Öncəki hissələr:

1) «Yapışqan» footer

2) İmage zoom on hover

    Əgər sizə qısa zamanda saytınızda gecə rejimi imkanı əlavə etmək lazımdırsa  invert və hue-rotate filtrlarından yararlanın.

    filter: invert() 0 dan 1-ə qədər ola bilər. 1 — artıq inversiyadır və burada ağ olan qara görsənir.

    filter: hue-rotate () sizin elementlərinizin rənglərini elə dəyişir ki, onlar öz aralarında eyni fərq dərəcələrini saxlamış olurlar. Value 0 ilə 360 dərəcə arasında ola bilər.

    Əgər bu effektlərin ikisini də body-də işlətsəniz qısa zamanda saytın gecə rejimini əldə edə bilərsiniz (bu halda fona rəng verilməsi mütləqdir).

Nümunə:

body {
    background: #FFF;
    filter: invert(1) hue-rotate(210deg);
}

Bu tənzimləmələrdən istifadə edərək Google-ın start səhifəsini belə dəyişmək olar: