1. Przystosowanie kodu HTML do pracy z CSS
HTML kiedyś i teraz
o HTML kiedyś - aby dobrze wyglądało
o HTML teraz - szkielet dla CSS
Pisanie HTML-a z myślą o CSS
o Pamiętaj o strukturze
o Dwa nowe znaczniki HTML do nauczenia
o O czym trzeba zapomnieć
o Podstawowe wskazówki
Znaczenie deklaracji typu dokumentu
2. Tworzenie stylów i arkuszy stylów
Anatomia stylu
Zrozumieć arkusze stylów
o Styl wewnętrzny czy zewnętrzny
Wewnętrzne arkusze stylów
Style zewnętrzne
o Dołączanie arkusza stylów przy użyciu znacznika HTML
o Dołączanie arkuszy stylów za pomocą kodu CSS
Kurs: tworzenie pierwszego stylu
o Tworzenie stylu wpisanego
o Tworzenie wewnętrznych arkuszy stylów
o Tworzenie zewnętrznego arkusza stylów
3. Podstawy selektorów - do czego odnoszą się style
Selektory znaczników - style dla całej strony
Selektory klas - precyzyjna kontrola
Selektor ID - unikalne elementy strony
Stylizowanie znaczników zagnieżdżonych
o Drzewo rodzinne HTML
o Tworzenie selektorów potomka
Nadawanie stylów grupom znaczników
o Grupowanie selektorów
o Selektor uniwersalny
Pseudoklasy i pseudoelementy
o Style odnośników
o Więcej pseudoklas i pseudoelementów
Zaawansowane selektory
o Selektor dziecka
o Selektor brata
o Selektor atrybutu
Kurs: selektory
o Tworzenie selektora grupowego
o Tworzenie i stosowanie selektora klasy
o Tworzenie i stosowanie selektora identyfikatora
o Tworzenie selektora potomka
4. Oszczędzanie czasu dzięki dziedziczeniu
Czym jest dziedziczenie?
Jak dziedziczenie upraszcza arkusze stylów
Granice dziedziczenia
Kurs: dziedziczenie
o Prosty przykład: dziedziczenie jednopoziomowe
o Wykorzystanie dziedziczenia do zmiany stylu całej strony
o Kiedy dziedziczenie nie działa
5. Zarządzanie wieloma stylami: kaskada
Kaskadowość stylów
o Style dziedziczone mogą się grupować
o Najbliższy przodek bierze górę
o Górę bierze styl bezpośredni
o Jeden znacznik wiele stylów
Precyzja: który styl weźmie górę
Kurs: kaskadowość w akcji
o Tworzenie stylu mieszanego
o Łączenie kaskady i dziedziczenia
o Rozwiązywanie konfliktów
6. Formatowanie tekstu
Formatowanie tekstu
o Wybór kroju czcionki
o Kolorowanie tekstu
Zmiana rozmiaru pisma
o Stosowanie pikseli
o Stosowanie słów kluczowych, procentów i jednostki em
Formatowanie słów i liter
o Pogrubienie i kursywa
o Zamiana tekstu na wielkie litery
o Dekorowanie tekstu
o Odstęp między wyrazami i literami
Formatowanie całych akapitów
o Zmienianie odstępu między wierszami
o Wyrównywanie tekstu
o Wcinanie pierwszego wiersza i usuwanie marginesów
o Formatowanie pierwszej litery lub pierwszego wiersza akapitu
Stylizowanie list
o Typy list
o Pozycjonowanie punktorów i numerów
o Punktory graficzne
Kurs: formatowanie tekstu
o Ustawienia strony
o Formatowanie nagłówków i akapitów
o Formatowanie list
o Wykańczanie projektu
7. Marginesy, dopełnienie i obramowanie
Istota modelu blokowego
Marginesy i dopełnienie
Ramki
o Skrócony zapis właściwości ramek
o Formatowanie poszczególnych krawędzi
Kolorowanie tła
Określanie wysokości i szerokości
Umieszczaj treść na elementach pływających
o Tła i ramki a elementy pływające
o Wstrzymać pływanie
Kurs: marginesy, tła i ramki
o Ustawianie marginesów
o Ustawianie odstępów wokół znaczników
o Wyróżnianie tekstu za pomocą teł i ramek
o Tworzenie paska bocznego
o Naprawianie błędów przeglądarki
8. Umieszczanie grafiki na stronach WWW
CSS i znacznik
Obrazy tła
Sterowanie powtarzaniem
Pozycjonowanie obrazu tła
Skrócona właściwość background
Kurs: tworzenie galerii zdjęć
Kurs: używanie obrazów tła
o Umieszczanie obrazu w tle strony
o Zastępowanie ramek grafiką
o Używanie grafiki w listach punktowanych
o Zaokrąglanie rogów paska bocznego
o Tworzenie zewnętrznego arkusza stylów
9. Upiększanie systemu nawigacji
Wybieranie odnośników do stylizacji
o Poznaj stany odnośników
o Wybieranie określonych odnośników
Stylizowanie odnośników
o Podkreślanie odnośników
o Tworzenie przycisku
o Używanie grafiki
Tworzenie pasków nawigacji
o Używanie list nienumerowanych
o Pionowe paski nawigacji
o Poziome paski nawigacji
Zaawansowane techniki pracy z odnośnikami
o Duże, klikalne przyciski
o CSS
o Drzwi przesuwne
Kurs: stylizowanie odnośników
o Podstawy formatowania odnośników
o Dodawanie obrazu tła do odnośnika
o Wyróżnianie odnośników zewnętrznych
o Oznaczanie odwiedzonych stron
o Tworzenie pionowego paska nawigacji
o Dodawanie efektu rollover i tworzenie odnośników "Jesteś tutaj"
o Poprawianie błędów Internet Explorera
o Z pionowego w poziomy
10. Formatowanie tabel i formularzy
Właściwy sposób używania tabel
Stylizowanie tabel
o Dodawanie dopełnienia
o Ustawianie wyrównania w pionie i w poziomie
o Tworzenie ramek
o Stylizowanie wierszy i kolumn
Stylizowanie formularzy
o HTML elementów
o Rozmieszczanie elementów formularza za pomocą CSS
Kurs: stylizowanie tabeli
Kurs: stylizowanie formularza
11. Tworzenie układów opartych na elementach pływających
Jak działa układ w CSS?
o
Dzielny znacznik
Typy układów stron WWW
Podstawy układów opartych na elementach pływających
Stosowanie elementów pływających w układach
o Używanie właściwości float dla wszystkich kolumn
o Elementy pływające wewnątrz elementów pływających
o Pozycjonowanie elementów za pomocą ujemnych marginesów
Rozwiązywanie problemów z elementami pływającymi
o Czyszczenie i zawieranie elementów pływających
o Tworzenie kolumn o pełnej wysokości
o Zapobieganie upadaniu elementów pływających
Rozwiązywanie problemów z Internet Explorerem
o Podwójny margines
o Trzypikselowa luka
o Inne problemy w IE
Kurs: układy wielokolumnowe
o Strukturyzowanie HTML-a
o Tworzenie stylów układu
o Dodawanie kolejnej kolumny
o Dodawanie "fałszywej kolumny"
o Ustawianie stałej szerokości
Kurs: układ z ujemnym marginesem
o Wyśrodkowywanie układu
o Pływające kolumny
o Końcowe poprawki
12. Pozycjonowanie elementów na stronie WWW
Jak działają właściwości pozycjonujące?
o Ustawianie wartości pozycjonujących
o Gdy pozycjonowanie bezwzględne jest względne
o Kiedy (i gdzie) używać pozycjonowania względnego?
o Stos elementów
o Ukrywanie fragmentów strony
Użyteczne strategie pozycjonowania
o Pozycjonowanie wewnątrz elementu
o Wyłamywanie elementu poza blok
o Używanie pozycjonowania CSS dla układu strony
o Użycie stałego pozycjonowania do tworzenia ramek za pomocą stylów CSS
Kurs: pozycjonowanie elementów strony
o Wzbogacanie banera strony
o Dodawanie podpisu do zdjęcia
o Rozmieszczanie głównych elementów strony
13. Dobre nawyki w CSS
Wstawianie komentarzy
Porządkowanie stylów i arkuszy stylów
o Jasno nazywaj style
o Używanie kilku klas dla zaoszczędzenia czasu
o Uporządkuj style za pomocą grupowania
o Korzystanie z wielu arkuszy stylów
Usuwanie przeszkadzających stylów przeglądarki
Wykorzystanie selektorów potomków
o Dzielenie stron na sekcje
o Zidentyfikuj ciało
Obsługa błędów Internet Explorera
o Najpierw projektuj dla nowoczesnych przeglądarek
o Oddziel kod CSS dla IE za pomocą komentarzy warunkowych
14. Podsumowanie