Wszystkie lekcje osobno kosztują 100,88 zł
Kup wszystkie razem za 39 zł
Oszczędzasz 61,88 zł
Kup wszystkie razem za 39 zł
Oszczędzasz 61,88 zł
Video Kurs CSS 3
Cena: 49 zł
Język: polski
Czas Trwania: 6h 26min 35s
Autor: Arkadiusz Włodarczyk
ISBN: 978-83-63445-26-3
Data Wydania: 31-10-2013
Wybierz wersję kursu:
39 zł
kursu CSS 3:
|
|
|
|
Nie kupuj kota w worku!
Sprawdź wcześniej kurs oglądając jedną lekcję tutaj (32 MB)
Zapraszam Cię do zapoznania się video kursem tworzeniem stron WWW w CSS 3!
Video Kurs CSS 3 trwa 6 godzin 26 minuty 36 sekundy! Jest to nie tylko nauka - ale i praktyka, nauczysz się tworzyć stron według najnowszych norm. Nasz kurs jest najbardziej aktualnym video kursem dotyczącym CSS 3.
Kurs jest przygotowany przez młodego człowieka, więc używany język jest przystępny dla każdego.
Czym jest CSS 3?
CSS 3 to kolejna wersja CSS rozszerzająca go o:
- nowe selektory
- transformacje 2D
- transformacje 3D
- płynne przejścia
- animacje
- zaokrąglone krawędzie
- cienie / przeźroczystość
- elastyczne projektowanie stron internetowych
- flex / table layout
- gradienty
- i wiele innych...
Więcej o tym czy jest CSS 3 w darmowej lekcji: tutaj
Z naszego kursu dowiesz się wszystkiego na temat CSS 3 oraz poznasz wiele sekretów. Aby każdy mógł zrozumieć techniki tworzenia stron, lektor nie tylko uczy, ale również podczas tłumaczenia radzi jak przyjacielowi co jest "lepsze", a co "gorsze".
Uwaga! CSS 3 to rozwinięcie CSS 2.1 o nowe elementy oznacza to, że wymagana jest znajomość XHTML i CSS. Podstawy CSS wyjaśniamy tutaj.
Przykładowy button, który tworzymy krok po kroku z pomocą nowinek CSS 3 wygląda w : następujący sposób
Zawartość kursu CSS 3
Lekcja 1 - Czym jest CSS 3? - 10 min i 0 s
- Dowiadujemy się czym jest CSS 3, co będziemy wiedzieć po kursie oraz jakie jest wsparcie CSS 3 w przeglądarkach. Czy powinniśmy się martwić IE, gdy korzystamy z CSS3, czy to jednak mit?
Lekcja 2 - Stworzenie projektu w Netbeans i omówienie szablonu html5boilerplate - 11 min i 13 s
- Tworzymy projekt w netbeans oraz omawiamy szablon html5boilerplate.
Lekcja 3 - Czym są vendor prefixy - 13 min i 1 s
- Dowiadujemy się czym są vendor prefixy, jak z nich korzystać oraz jak sprawić, by znalezienie vendor prefixów trwało jak najkrócej. Poznajemy również skrypt, który robi to za nas.
Lekcja 4 - Selektory i właściwości pod IE - 6 min i 58 s
- Dowiadujemy się jak sprawić by nowe selektory i właściwości działały pod IE
Lekcja 5 - Selektory - 11 min i 12 s
- Przypominamy sobie czym są selektory oraz analizujemy podstawowe selektory CSS.
Lekcja 6 - Selektory Atrybutów - 17 min i 54 s
- Dowiadujemy się czym są selektory atrybutów przedstawiając je na praktycznych przykładach. Pokazujemy jak stworzyć własny atrybut i się do niego odwołać.
Lekcja 7 - Pseudo Selektory - 34 min i 8 s
- Dowiadujemy się jak:
- jak stworzyć tooltip (wskazówkę / dymek) z podpowiedzią z użyciem wyłącznie CSS 3!!
- sprawić, aby w tabeli parzyste / nieparzyste wiersze miały inne tło - jak podmienić kolor przeglądanego wiersza tabeli oraz wyświetlić po najechaniu myszką dodatkowe wcześniej ukryte informacje
- jak po zaznaczeniu inputa typu radio zmienić tekst obok, aby sugerował, że odpowiedni radio został oznaczony
- jak dodać obramowanie wokół inputa typu tekstowego podczas (skupienia), czyli np. wpisywanie czegoś do odpowiedniej rubryki w formularzu
- jak dodać przed każdym linkiem ikonę, która reprezentuje ściąganie plików - dodatkowo jak sprawić, by po najechaniu na taki link zmieniała ona swój odcień
- jak zedytować wygląd tylko np. pierwszej kolumny w tabeli
- jak sprawić, żeby np. co drugie tło wiersza miało inny kolor (tabela lepiej wygląda)
- jak zmienić styl pierwszej litery w każdym akapicie
- jak zmienić styl pierwszej linii w każdym akapicie
- jak przy pomocy CSS 3 po kliknięciu pokazać ukryty element i przenieść do niego skupienie ekranu (jak sprawić, by klikniętej zlinkowanej etykiecie nadać styl)
- i kilka innych
Lekcja 8 - Web fonts - własne czcionki - 16 min i 6 s
- - pokazujemy jak ściągać oraz korzystać z czcionek google fonts
- pokazujemy jak działa reguła font-face na przykładzie zwykłych czcionek ściągniętych z internetu. Zastanawiamy się nad tym jak sprawić, aby czcionka była wspierana w każdej przeglądarce oraz jakie czcionki wybierać by nie łamać licencji
Lekcja 9 - Transformacja Tekstu - 1 min i 44 s
- jak sprawić, aby wybrany przez nas tekst zmienił wszystkie litery na duże / małe albo zmienił wielkość tylko pierwszych liter na duże?
Lekcja 10 - Cienie - 9 min i 36 s
- jak stworzyć cienie dla tekstu oraz boxów, jak stworzyć efekt 3d tekstu przy pomocy cieniów
Lekcja 11 - Przeźroczystość - 5 min i 7 s
- - dowiadujemy się jak korzystać oraz jakie są różnice między opacity oraz rgba
- dowiadujemy się jak zmienić hashowany kolor na wersję rgb
- poznajemy ciekawą stronę do generowania tła
- jak sprawić, aby rgba działało w starszych wersjach IE
Lekcja 12 - Zaokrąglone krawędzie - 4 min i 6 s
- - jak tworzyć zaokrąglone krawędzie
- jak sprawić, by działały pod IE
- poznajemy ciekawą stronę do generowania krawędzi
- jak tworzyć krawędzie o różnych zaokrągleniach
Lekcja 13 - Gradienty - 10 min i 37 s
- - czym jest gradient
- jak sprawić, aby działał pod IE6+ oraz innych przeglądarkach
- poznajemy ciekawe generatory gradientów i omawiamy jak działają
- pokazujemy jak uniknąć błędów w wyświetlaniu gradientów w różnych przeglądarkach
Lekcja 14 - Transitions - płynne przejścia - 16 min i 47 s
- - jak tworzyć płynne przejścia np. zmiany koloru oraz tła po najechaniu na przycisk "Zaloguj się"
- jak tworzyć własne przejścia nie zdefiniowane w css z pomocą cubiz-bezier
- jak stworzyć prostą płynną animację przejścia 'klocka' z jednego miejsca na drugie
Lekcja 15 - Transformacje 2D - 8 min i 12 s
- W jaki sposób przeskalować, obrócić, przesunąć, pochylić elementy na stronie. Jak po kliknięciu na np. przycisk wykonać płynną animację przesunięcia i obrócenia elementu.
Lekcja 16 - Animacje - 16 min i 3 s
- Jak tworzyć skomplikowane animacje w CSS 3. Jak zatrzymać / kontynuować wykonywanie animacji w np. środku jej wykonywania.
Lekcja 17 - Transformacje 3D - 23 min i 43 s
- Jak działają transformacje 3d. Omawiamy rotacje wokół osi X,Y,Z. Czym jest perspektywa i jak działa. Jak prawidłowo tworzyć obiekty do transformacji w 3d. Jak sprawić, aby po najechaniu 'kartka' obróciła się na drugą stronę. Jak tworzyć ciekawsze efekty obracania np. tak jakby były przewracana kartki w książce.
Lekcja 18 - Kostka 3D - 14 min i 18 s
- Ćwiczymy poprzednie lekcje. Tworzymy krok po kroku od zera kostkę sześcienną w 3d oraz sprawiamy, aby się kręciła.
Lekcja 19 - Zabawa z tłem - 10 min i 43 s
- Poznajemy multiple backgrounds (wielokrotne tła) - jak sprawić, aby mieć więcej niż jedno tło w jednym elemencie. Jak zmienić rozmiar tła, jego początek powtarzania oraz przycięcie. Poznajemy właściwości background-size, background-origin oraz background-clip.
Lekcja 20 - Wielokolumnowy układ treści - 3 min i 51 s
- Co zrobić, aby wyświetlać tekst w kolumnach?
Lekcja 21 - Flex Box Layout - 22 min i 38 s
- Omawiamy bardzo dokładnie czym jest oraz jak działa elastyczny układ pudełka.
Lekcja 22 - Flex box - szablon strony - 11 min i 17 s
- Tworzymy najpopularniejszy szablon strony z pomocą flex (nagłówek, nawigacja, artykuł, reklama, stopka).
Lekcja 23 - Flex Box - wsparcie - 10 min i 59 s
- Pokazujemy co zrobić, aby flex box był wspierany w jak najszerszej gamie przeglądarek.
Lekcja 24 - Viewport - 20 min i 31 s
- Czym jest viewport?
W jaki sposób rzutowane i skalowane są elementy na mobilnych urządzeniach typu komórki / tablety.
Jaki wpływ na wyświetlanie na urządzeniach mobilnych ma viewport na stronach, które stosują responsive web design oraz na stronach, które nie stosują responsive web design.
Poznajemy narzędzie, które pozwolą przeglądać naszą stronę internetową przez 'widok' komórki / tabletu.
Lekcja 25 - Responsive Web Design - media queries - 20 min i 28 s
- Mówimy o projektowaniu elastycznych stron internetowych oraz jak korzystać z media queries. Jak sprawić, aby nasza strona była 'responsive', czyli reagowała na zmianę rozmiaru przeglądarki.
Lekcja 26 - Display Table - 6 min i 55 s
- Jak zasymulować layout tabelowy, nie korzystając z tagów tabeli? Po co z czegoś takiego korzystać i kiedy jest to uzasadnione?
Lekcja 27 - Wygląd strony przygotowany pod drukowanie - 9 min i 2 s
- Jak sprawić, aby np. posiadając bloga użytkownik naszej strony wydrukował tylko sam artykuł nie tracąc tusz na niektóre zbędne obrazki / nawigację / reklamy, czy też kolor tła.
Lekcja 28 - Animowany button w 3D - 14 min i 47 s
- Jak stworzyć cudownie wyglądający animowany po kliknięciu button, który wygląda jakby był w 3D.
Lekcja 29 - Rozwijane Menu w CSS 3 - 24 min i 30 s
- Tworzymy od zera krok po kroku rozwijane menu z pomocą CSS 3.
Video Kursy?