Tutorial video, wersja MP3
Mirosław Zelent
W poprzednim odcinku kursu dokonaliśmy starannego przeglądu znaczników HTML, zaś w tym odcinku przepracujemy wszystko co na pewno trzeba do egzaminu wiedzieć, jeśli chodzi o arkusze stylów CSS.
Znajdź w filmie
Nasze tutoriale posiadają tzw. timestamps (chwile czasowe) - dzięki nim łatwo odnajdziesz interesujące fragmenty wiedzy. Wystarczy kliknąć na podane w nawiasach kwadratowych momenty filmu, by przewinąć tutorial dokładnie do interesującego Cię miejsca w odcinku.
[ 00:00:13 ] Tytułem wstępu
[ 00:02:34 ] Omówienie plików projektu
[ 00:03:49 ] Jaką witrynę wykonamy?
[ 00:04:14 ] CSS = kaskadowe arkusze stylów
[ 00:04:31 ] Selektory, atrybuty, wartości
[ 00:06:17 ] Identyfikator ID i klasa CLASS
[ 00:08:01 ] Kiedy użyć klasy a kiedy identyfikatora?
[ 00:11:20 ] Podstawowe rodzaje selektorów
[ 00:12:00 ] Różne metody dołączenia stylów CSS do HTML
[ 00:16:08 ] Klauzula !important
[ 00:18:06 ] Wyśrodkowanie elementu, automatyczne marginesy
[ 00:19:38 ] Operator myślnika "-", hierarchia atrybutów
[ 00:20:29 ] Tło elementu: background
[ 00:21:27 ] Ścieżka do pliku zewnętrznego: url, background-image
[ 00:23:05 ] Powtarzanie tła: background-repeat
[ 00:24:59 ] Pozycja tła: background-position
[ 00:27:22 ] Tworzenie struktury witryny
[ 00:30:29 ] Krój czcionki: font-family
[ 00:31:21 ] Rozmiar czcionki: font-size
[ 00:32:10 ] Waga czcionki: font-weight
[ 00:32:46 ] Styl czcionki: font-style
[ 00:33:20 ] Wyrównanie tekstu: text-align
[ 00:33:54 ] Zmiana wielkości liter: text-transform
[ 00:34:41 ] Odstęp pomiędzy znakami: letter-spacing
[ 00:38:44 ] Wysokość linii tekstu: line-height
[ 00:39:17 ] Nadawanie odstępów: margin, padding
[ 00:39:48 ] Nakładanie się (collapse) pionowych marginesów
[ 00:40:37 ] Przykłady koniecznego użycia paddingu
[ 00:41:24 ] Możliwe zapisy marginesów w CSS
[ 00:45:32 ] Obramowanie: border
[ 00:47:25 ] Stylizowanie list (ul, ol)
[ 00:49:38 ] Uchwycenie kilku list z użyciem klas
[ 00:51:41 ] Wygląd markera listy: list-style-type
[ 00:53:18 ] Obraz jako marker listy: list-style-image
[ 00:54:08 ] Pozycja markera listy: list-style-position
[ 00:55:34 ] Zapis złożony (potrójny): list-style
[ 00:56:20 ] Uchwycenie elementu listy (li)
[ 00:58:00 ] Stylizowanie hiperłączy (a href)
[ 00:59:33 ] Wyróżnienie tekstu: text-decoration
[ 01:00:12 ] Stylizowanie hiperłączy z użyciem pseudoklas
[ 01:03:11 ] Stworzenie kilku rodzajów linków w podstronie
[ 01:05:32 ] Zapis kolorów w CSS, zapis szesnastkowy
[ 01:06:37 ] Zapis dziesiętny koloru - z użyciem rgb()
[ 01:08:23 ] Skrócony, trzyznakowy zapis szesnastkowy koloru
[ 01:08:51 ] Color pickery, trening interpetowania barw
[ 01:09:13 ] Nieprzezroczystość: opacity
[ 01:10:17 ] Nadawanie przezroczystego koloru: rgba()
[ 01:11:08 ] Położenie elementu: position
[ 01:11:46 ] Pozycja statyczna - position:static
[ 01:13:49 ] Pozycja relatywna - position:relative
[ 01:15:05 ] Pozycja absolutna - position:absolute
[ 01:16:17 ] Pozycja ustalona - position:fixed
[ 01:17:37 ] Słowo końcowe
[ 01:18:15 ] Podsumowanie odcinka na slajdach
Pobierz wersję MP3
Dobrym rozwiązaniem w czasie przygotowań do egzaminu jest pobrać sobie odcinki w formacie mp3, aby w wolnej chwili (kiedy np. ćwiczysz fizycznie, podróżujesz) wrzucić sobie tutorial na słuchawki i odtworzyć w umiarkowanym skupieniu, aby osłuchać się wstępnie z nowym tematem. Natomiast jeśli tutorial zawiera momenty, w których prowadzący wykonuje jakieś konkretne działania na pulpicie komputera, to spróbuj następującego ćwiczenia: postaraj się zwizualizować sobie co dzieje się na video, mimo iż tylko słyszysz co prowadzący zapisuje, klika, zaznacza, zmienia.
A następnie, po powrocie do domu, zajrzyj na ile to czego się spodziewasz, odbiegać będzie od rzeczywistej czynności ukazanej na filmie. Przypomina to trening szachistów, którzy rozgrywają partie na wirtualnej szachownicy w swojej głowie - to fantastyczne ćwiczenie, gdyż pozwala głębiej zapamiętać oraz zrozumieć co i dlaczego zostało wykonane.
Polecamy: Sekurak Academy 2024
Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp do materiałów z edycji Sekurak Academy z roku 2023! Przy zakupie możecie skorzystać z kodu: pasja-akademia w koszyku, uzyskując rabat -30% na bilety w wersji "Standard" - warto korzystać! Więcej szczegółów znajdziecie tutaj.
Książka: Wprowadzenie do bezpieczeństwa IT
Niedawno wystartował dodruk świetnej, rozchwytywanej książki pt. "Wprowadzenie do bezpieczeństwa IT, Tom I" (około 940 stron). Mamy dla Was kod: pasja (wpisz go w koszyku), dzięki któremu otrzymacie 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla naszych Widzów! Jest to pierwszy tom serii o ITsec, który wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!
Pomóż dzieciom
Polska Akcja Humanitarna od wielu lat dożywia dzieci. Prosimy, poświęć teraz dosłownie chwilę i pomóż klikając w oznaczony strzałką zielony brzuszek Pajacyka. Dziękujemy!
Komentarze
Czy macie jakieś pytania, sugestie, uwagi? A może zauważyliście literówkę albo błąd? Dajcie koniecznie znać w komentarzach! Dziękujemy Wam za poświęcony na to czas!
Disqus