[CSS] Jak zrobić migające tło?

Z tego wpisu dowiesz się jak zrobić animowane migające tło na stronie.

Aby zrobić migające tło, tzn. zmieniające kolor z jednego na drugi, posłużyć się trzeba regułą tworzenia animacji - @keyframes

Przykład

W poniższym przykładzie definiujemy animację "blink" zmieniającą kolor tła z pomarańczowego na zielony. Następnie wywołujemy stworzoną animację dla znacznika body. Oczywiście kolory i prędkość animacji każdy sobie ustawi wedle swojego uznania.

@keyframes blink {

  0% { background-color: orange; }
  50% { background-color: green; }
  100% { background-color: orange; }
  
}

body {

  animation: blink 2s infinite;
  
}

Komentarze

Prześlij komentarz

Dzięki za komentarz!

Popular

[C++] Jak obliczyć pole i obwód trapezu?

Przed napisaniem programu obliczającego pole i obwód trapezu, przypomnij sobie wzory. Pole trapezu liczymy według wzoru P=((a+b)*h)/2. Wzór na obwód Ob=a+b+c+d. Obliczając pole trapezu musimy znać rozmiary dwóch podstaw i wysokości. Obliczamy pole trapezu #include <iostream> using namespace std; int main() { int a; int b; int h; double p; cout << "Podaj długość podstawy a: "; cin >> a; cout << "Podaj długość podstawy b: "; cin >> b; cout << "Podaj wysokość: "; cin >> h; if(cin.good() == true) { p = ((a + b) * h) / 2.0; cout << "Pole trapezu wynosi: " << p; } return 0; } Obliczamy obwód trapezu #include <iostream> using namespace std; int main() { int a, b, c, d, ob; cout << "Podaj długość boku a: "; cin >> a; cout << "Podaj długość boku b: "; cin >> b; cout << "Podaj długość boku c: "; cin >> c;...
Czytaj więcej

[HTML] Jak wyśrodkować tekst?

Wyśrodkowanie tekstu w HTML nie jest trudne. Wystarczy tylko zastosować odpowiednią regułę CSS dla elementu, w którym znajduje się dany tekst. W tym przypadku chodzi o regułę text-align:center . Przykład Załóżmy, że mamy nagłówek h1 z tytułem strony i chcemy, aby był on umieszczony po środku. Dopisujemy do niego następujący fragment: style="text-align:center;" - tak jak poniższym przykładzie: <h1 style="text-align:center;">Hello World!</h1> Analogicznie robimy dla innych elementów HTML.
Czytaj więcej

[PHP|HTML] Odświeżenie strony

W tym wpisie zajmiemy się odświeżaniem strony z poziomu PHP jak i poprzez odpowiedni metatag HTML. Zapewne tworząc lub modyfikując jakąś stronę HTML spotkałeś/-aś się kiedyś z tagiem meta refresh . Jak pamiętasz (lub nie) tag ten służy do odświeżania lub przekierowania na inny URL z poziomu klienta. W takim razie co zrobić, gdy chcemy takie odświeżenie lub przekierowanie wymusić po stronie serwera? W języku PHP z pomocą przychodzi nam funkcja header , która służy do wysyłania surowych nagłówków HTTP do przeglądarki. Funkcja jest prosta w użyciu, a kod umożliwiający odświeżenie strony ogranicza się do jednej linii. My jednak napiszemy własną funkcję, która będzie odświeżała stronę. Nasza funkcja będzie oczywiście oparta o funkcję header. Odświeżanie strony HTML Aby emulować nagłówki HTTP z poziomu kodu HTML, należy użyć tagu meta http-equiv . Jeśli zatem chcemy odświeżyć lub przekierować stronę z poziomu przeglądarki, tworzymy w sekcji head taki tag: <meta http-equiv="refresh...
Czytaj więcej