Niedzielny zrzut linków #6

Dzisiaj będą linki o HTML/CSS, z położonym akcentem na CSS Grid.

Courses - code club

Tutoriale do HTML/CSS, a także do innych języków (Pythona, Scratch, Raspberry PI, Sense Hat i Sonic Pi). Tutoriale się wyróżniają tym, że są małe kroki, dużo ilustracji i jakaś "fabuła" (dlatego zwróciły moją uwagę - często tutoriale są nudne jak barszcz, a te się wydają spoko). Poziom wydaje się być raczej podstawowy.

Jeśli natomiast chcecie czegoś bardziej zaawansowanego, to możecie pouczyć się grida. Choćby z tego tutoriala na Youtube:

How to create website layouts using CSS grid

Grid to taka prostokątna niewidzialna "siatka", którą się nakłada na stronę, żeby wyrównać elementy (które potem sobie siedzą w takich niewidzialnych kwadracikach). Znacie tę koncepcję od czasów tabelek. Potem był Bootstrap i jego klasy "row" czy "col-coś-tam". A teraz jest grid w CSS, bez tabelek czy Bootstrapa.

Jeżeli jeszcze macie wątpliwości, że grid jest potrzebny, to obejrzyjcie
na Youtube video pod tytułem:  CSS Grid Changes Everything (About Web Layouts) , na którym pan o nazwisku Morten Rand-Hendriksen entuzjastycznie wyjaśnia znaczenie tego wiekopomnego ficzera.

Oraz zapamiętajcie nazwisko Rachel Andrew, bo to kobieta, która dużo namieszała w temacie.

Zrobiła na przykład stronę pod tytułem "siatka w przykładach":
Grid by example

Poza tym wybadajcie ją na Yotutube:
https://www.youtube.com/results?search_query=Rachel+Andrew%2C+
daje talki i w ogóle ma swój jakiś tam udział w tym, że w ogóle takie coś się pojawiło w CSS.

No a jeśli chcecie natomiast bardziej uporządkowanej wiedzy o CSS Grid to możecie wreszcie poczytać dwie zupełnie różne i niezwiązane (chyba) ze sobą strony o takich samych prawie tytułach:

A Complete Guide to CSS Grid

Strona z Codrops reference. Dużo tekstu, ale również dużo ilustracji.

Oraz:

A Complete Guide to Grid
czyli taka ściągawka z CSS Tricks. Najważniejsze właściwości i ilustracje. Jakbyście zapomnieli, która właściwość do czego służy.








Komentarze

Popularne posty z tego bloga

Ściemy z ogłoszeń o pracę

Jak nie sprawdzać wiedzy technicznej: platformy online

Jak zrobić prostą grę w JavaScript?