Podstawy HTML
#1. Wstęp do HTML. Znaczniki, struktura oraz pierwsza strona
Strona internetowa. Zarządzaniem wyglądem za pomocą HTML. Budowa szkieletu strony, zagnieżdzanie znaczników oraz budowa pierwszej strony Przejdź do posta!
#2. Tworzymy listy, tabele, linki oraz dodajemy obrazki
Tworzymy listy uporządkowane i nieuporządkowane, dodajemy tabele, umieszczamy linki oraz obrazki Przejdź do posta!
#3. Tworzymy podstawowe style
Poznajemy podstawowe style CSS aby strona nabrała estetyki. Przejdź do posta!
#4. Poznajemy ważne znaczniki
Dowiadujemy się o znacznikach, które pozwolą nam zbudować układ strony Przejdź do posta!
Pierwsza strona
#5. Podsumujmy wiedzę oraz zbudujmy stronę o sobie
…tak jak w tytule Przejdź do posta!
Podstawy CSS
#6. Poznajmy bliżej CSS Rozpoczynamy pracę z regułami CSS, selektorami klas i tagów Przejdź do posta!#7. Coś więcej na temat selektorówDowiemy się o selektorach, dziedziczeniu i pierwszeństwie stylów Przejdź do posta!#8. Kolorowanie wybranych elementów HTMLW tym poście pokaże jak dodawać kolory na wybrane elementy HTML Przejdź do posta!#9. Stylujemy nasz tekstBawimy się tekstem zmieniając jej czcionkę, kolor, dekorację, wielkość oraz pogrubienie Przejdź do pota!Tytuł spojleraDodajemy ramki, marginesy, odstępy oraz zmieniamy wielkości elementów Przejdź do posta!#11. Listy i tabele w CSSZmieniamy wygląd list i tabel Przejdź do posta!
Druga strona – ładniejsza
#12. Strona sklepu komputerowegoZróbmy stronkę korzystając z wiedzy z poprzednich postów Przejdź do posta!
Budowa layoutu
#13. Pierwsze kroki z layoutem
Krótkie wytłumaczenie czym jest układ strony oraz dlaczego jest istotnym elementem każdej witryny internetowej Przejdź do posta!
#14. Podział elementów na blokowe i liniowe
Wyszukamy podstawowe różnice w sposobach wyświetlania różnych elementów strony www Przejdź do posta!
#15. Rozmieszczanie elementów w poziomie na stronie www
Popróbujemy użyć CSS do rozmieszczania elementów Przejdź do posta!
#16. Layout strony
Poznamy podstawowy układ jednokolumnowy oraz jego pozytywne cechy Przejdź do posta!
#17. Spróbujmy popracować z panelem
Stworzymy zaawansowany układ na stronie Przejdź do posta!
#18. Pierwsze pozycjonowanie elementów na stronie www
Omówimy nowe właściwości position Przejdź do posta!
#19. Grid i wszystko jasne?
Podstawowa budowa girdu oraz zastosowanie Przejdź do posta!
Trzecia strona – poukładana
#20. Strona ze zdjęciami
Stworzymy stronkę ze zdjęciami Przejdź do posta!
Zabawa z CSS
#21. Czcionki ładne i inne
Dodajemy czcionki zewnętrzne do naszej strony Przejdź do posta!
#22. Edycja tekstu
Zawijanie oraz transformacje tekstu. Sztuczki i jeszcze raz sztuczki Przejdź do posta!
#23. Tło z grafiką
Ustawiamy właściwości zarządzające tło graficzne. Przejdź do posta!
#24. Przezroczystość i cieniowanie
Dodajemy estetyczne cieniowania i przezroczystości naszym elementom strony www Przejdź do posta!
#25. Stany elementów
Poznajemy pseudo elementy. Przejdź do posta!
#26. Właściwość overflow
Zmierzymy się z suwakami oraz wymykającym się tekstem Przejdź do posta!
#27. Jednostki miar
Poznajemy dostępne jednostki miar w CSS Przejdź do posta!
#28. Formatowanie deklaracji CSS
Poznajemy właświwości przyjmujące kilka parametrów. Przejdź do posta!
Czwarta strona – Przedstawienie
#29. Wizytówka www
Tworzymy stronę typu wizytówka Przejdź do posta!
Flexbox
#30. Elastyczne boksy
Tworzymy koncepcję modelu budowy layoutu za pomocą technologii Flexbox Przejdź do posta!
#31. Wybieramy kierunek wyświetlania
Określamy kierunek wyświetlania elementów w wierszu i kolumnie Przejdź do posta!
#32. Pozycjonowanie elementów
Rozmieszczamy elementy w pionie i poziomie Przejdź do posta!
#33. Dwukolumnowy szkielet
Budujemy layout za pomocą Flexboxa Przejdź do posta!
#34. Grid na flexie
Krok po kroku, budowa grida z użyciem flexboxa Przejdź do posta!
Projekt – Galeria
#35. Galeria z flexboxa
Projekt zostanie stworzony za pomocą metody wyświetlania elastycznego – flexboxa Przejdź do posta!
Selektory CSS
#36. Złożone kombinatory
Poznajemy kombinatory, które pomogą odwoływać się do elementów na stronie Przejdź do posta!
#37. Stany elementów
Tym razem poznamy pseudoklasy pomocne w odwoływaniu się do elementów HTML Przejdź do posta!
#38. Pseudoklasy
Dowiemy się z materiału co to są pseudoklasy Przejdź do posta!
#39. Pseudoelementy
Poznamy kilka przykładów wspomnianych pseudoelementów Przejdź do posta!
#40. Selektory atrybutu
Poznamy kilka pomocnych selektorów atrybutu Przejdź do posta!
Piąta strona – Budowa strony
#41. Budowa strony internetowej
W ramach ćwiczenia zbudujmy stronę internetową Przejdź do posta!
Bootstrap
#42. Bootstrap – krótkie wyjaśnienie
Pierwsze kroki w Bootstrapie? Z moim materiałem będzie łatwiej Zapraszam Przejdź do posta!
#43. Komponent – tabela
Najważniejsze informację które dotyczą tabeli w Bootstrapie znajdziesz tutaj! Przejdź do posta!
#44. Komponent – formularz
Najważniejsze informację które dotyczą formularza w Bootstrapie znajdziesz tutaj! Przejdź do posta!
#45. Paginacja
Chcesz zarządzać numerowaniem stron na swoim blogu? Zobacz wpis i zrozum paginację Przejdź do posta!
#46. Listy
Chcesz stworzyć przejrzystą listę w Bootstrapie? Zapraszam do materiału! Przejdź do posta!
#47. Panele
Chciałbyś zamieścić kontent w estetycznym “pudełku”? Właśnie od tego są panele. Przejdź do posta!
#48. Obrazki i etykiety
Chciałbyś zamieścić obrazki i etykiety na swojej stronie Bootstrap? Sprawdź jak się do tego zabrać Przejdź do posta!
#49. Responsywność strony
Responsywność na tle Bootsrapa? Sprawdź jak łatwo zastosować w swoich projektach Przejdź do posta!
#50. Zastosowanie elementów CSS
Bootstrap + JavaScript
#51. Bootstrap + JavaScript – wprowadzenie
Zobaczysz podstawy korzystania z frameworków wykorzystujących JavaScript Przejdź do posta!
#52. Komponent – Karuzela
Wraz z wejściem frameworku Bootstrapa, karuzela stała się nieodłącznym elementem każdej strony. Przejdź do posta!
#53. Komponent – menu
Podstawy masz już za sobą. Czas na rozszerzenie tematu! Przejdź do posta!
#54. Komponent – button
Zaawansowane tworzenie przycisków – sprawdź Przejdź do posta!
#55. Komponent – media object
Sprawdź jak tworzyć system komentarzy, tweetów, itp… Przejdź do posta!
#56. JavaScript – Modal
Wyświetlanie wiadomości której użytkownik nie przegapi. Zapraszam do materiału! Przejdź do posta!
#57. JavaScript – Taby
Dynamiczne zawartości zakładek. Sprawdź jak się do tego zabrać. Przejdź do posta!
#58. JavaScript – Tooltip
Pomocniczy tekst na stronie? Sprawdź jak łatwo zastosować w swoich projektach. Przejdź do posta!
#59. JavaScript – Popover
Jak dodać okienku przy przycisku lub linku? Sprawdź! Przejdź do posta!
#60. Elementy JavaScript – ćwiczenieSprawdź zdobytą przez siebie wiedzę! Rozwiąż ćwiczenie przygotowane przeze mnie. Przejdź do posta!
Formularze
#61. Input – tag oraz jego typy
Podstawowy element formularzy a zarazem najbardziej wszechstronny Przejdź do posta!
#62. Najważniejsze tagi formularzy
W tym materiale poznasz najważniejsze tagi HTML, na których zbudowane są formularze. Przejdź do posta!
#63. Atrybuty i akcje formularzy HTML
Zobacz jak wykorzystywać akcje oraz atrybuty. Przejdź do posta!
#64. Stylowanie formularzy
Jak ostylować formularz – zobacz! Przejdź do posta!
#65. Stylowanie inputów
Istnieją wyjątki w kwestii stylowania inputów – sprawdź! Przejdź do posta!
#66. Nietypowe wykorzystanie inputów
Sprawdź jak inaczej można wykorzystać inputy. Przejdź do posta!
#67. Formularz internetowy – ćwiczenie
Ćwiczenie do wykonania – formularz w sprawie wynajęcia przedmiotu. Przejdź do posta!
Animacje i grafika w CSS
#68. Animacje CSS – wprowadzenie
Nauczymy się stylować grafiki i animacje poprzez CSS. Przejdź do posta!
#69. CSS – przejścia
Zobaczysz jak łatwo tworzyć przejścia CSS. Przejdź do posta!
#70. 2D – tworzymy transformacje
Edycja obrazka i tekstu już nie będzie dla Ciebie tajemnicą. Przejdź do posta!
#71. 3D – tworzymy transformacje
Zobacz jak tworzyć bardziej skomplikowane transformacje. Przejdź do posta!
#72. Animacje CSS – ciąg dalszy.
Kontynuacja tematu animacji CSS – zobacz! Przejdź do posta!
#73. CSS – filtry
Zobacz jak korzystać z filtrów CSS. Przejdź do posta!
#74. CSS – gradienty
Gradienty za pomocą CSS. Sprawdź materiał! Przejdź do posta!