Wszystkie posty z kategori "CSS"

Baner animowany

Jak niektórzy wiedzą, od jakiegoś czasu zajmuję się nauczaniem frontendu.
Z wczorajszą grupą kończyliśmy temat sass, i między innymi animacji css, czyli tego o czym pisałem ostatnim razem.
Nie ukrywam – bardzo lubię te tematy, bo pozwalają trochę poczarować.
Zawsze po skończeniu takiego działu zabieramy się za jakiś mini projekt, który zbiera i podsumowuje poznane techniki.
Tym razem przygotowałem dla kursantów baner, który miał służyć do poćwiczenia animacji.
Niestety bardzo mało czasu spowodowało, że zamiast wykonać całość od początku do końca, zdążyliśmy tylko omówić jakie techniki zastosować na danych składowych tego banera. Całość zostawiłem im do samodzielnego wykonania.

Dzisiaj rano wstałem i stwierdziłem, że takie zadanie to fajny materiał na tutorial. Nie teoria, a praktyka.
No to co? Zaczynamy?

Animacje css

Animacje w CSS3

Ah animacje, piękne animacje. Ileż to można o nich pisać. Całe książki. Wbrew pozorom jednak wcale aż tyle tego nie ma. Przynajmniej w teorii, bo w praktyce można całkiem fajnie poczarować.

Float i inline-block

W dzisiejszym artykule mała powtórka z przeszłości.
Sporo młodych webmasterów twierdzi, że nie ma sensu uczyć się technik związanych z floatami i display:inline-block, bo w dzisiejszych czasach są inne techniki.
Moje zdanie jest odmienne. Dobry webmaster nie musi używać tych technik. Ale musi je znać, bo pewnego dnia może na nie natrafić. I wtedy co powie? Wie pan – ja panu tego nie zrobię, bo ja umiem tylko nowe…

Chart.js – wykresy

Tym razem weźmiemy pod warsztat tworzenie wykresów z wykorzystaniem biblioteki ChartJS. Jest darmowa biblioteka umożliwiająca umieścić na naszej stronie wykresy wszelakiego typu. Nie ma może możliwości jak profesjonalne biblioteki (jak chociażby Highcharts), ale w wielu miejscach w zupełności wystarcza.
W poniższym tekście nagniemy jej domyśle ustawienia tak by były bardziej uniwerstalne.