Jak nauczyć się CSS?

Kaskadowe arkusze stylów CSS (Cascading Style Sheets) pozwalają nadawać wygląd stronom internetowym. Oznacza to, że dzięki CSS zastosujesz style do elementów znajdujących się w HTML. Przykładowo, aby zaznaczyć wszystkie linki na stronie HTML i zmienić ich kolor na żółty, wystarczy napisać poniższy kod CSS:


a {
color: yellow;
}

W internecie o CSS napisano już wszystko. Dlatego nie chcę tutaj tworzyć kolejnego poradnika. W tym krótkim wpisie zebrałem kilka wartościowych źródeł, dzięki którym nauczysz się CSS.

Podstawy CSS

Zastanawiasz się jak nauczyć się CSS od absolutnych podstaw? W tym zakresie jak zwykle niezastąpiona jest dokumentacja MDN od Mozilli.

Sprawdź temat CSS podstawy w dokumentacji MDN:

https://developer.mozilla.org/pl/docs/Web/CSS

Kurs CSS

W poprzednim artykule pisałem o tym, jak nauczyć się html. HTML i CSS są ze sobą ściśle połączone, dlatego możesz zacząć naukę od kursu “Web developer od podstaw” autorstwa Samuraja Programowania:

https://www.udemy.com/course/kurs-web-developer-od-podstaw-w-15-dni/

To taki kurs HTML i CSS w jednym. W sam raz dla początkujących. Też od tego zaczynałem.

Nauka CSS

Ucząc się CSS-a szybko zorientujesz się, że to wcale nie takie trudne. Szybko ogarniesz podstawy i będziesz w stanie stworzyć prostą stronę internetową. Po kilku własnych projektach zaczniesz zastanawiać się w jaki sposób ulepszyć swój CSS. Wtedy przyjdzie pora na zapoznanie się z poniższymi tematami:

BEM

Krótki poradnik BEM na kanale YouTube overmenta:

Sass

Nie przepadam za nauką z książek, ale ta pozycja jest naprawdę spoko:

https://helion.pl/ksiazki/sass-nowoczesne-arkusze-stylow-bartosz-chucherko,sasspp.htm#

Flexbox

Kompletny przewodnik po Flexbox-ie na świetnej stronie CSS-Tricks:

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Grid

Znowu CSS-Tricks i tym razem kompendium korzystania z Grida:

https://css-tricks.com/snippets/css/a-guide-to-grid/

To tyle na dziś! Jestem przekonany, że dzięki wymienionym materiałom szybko ogarniesz CSS-a i będziesz mógł przejść krok dalej, czyli do nauki JavaScriptu.

 

Dodaj nowy komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *