HTML5 i CSS3. Zaawansowane wzorce projektowe - ebook

Oszałamiające możliwości HTML5 pozwoliły projektantom na tworzenie zaawansowanych stron oraz aplikacji internetowych. Jednak wszędzie tam, gdzie realizowane są rozbudowane projekty, zaczynają się problemy ze złożonością struktury tworzonego rozwiązania. W typowych językach programowania zostało to już zauważone dawno temu, a antidotum na te bolączki stały się wzorce projektowe. Teraz przyszedł czas na HTML - najwyższa pora poznać najlepsze rozwiązania typowych problemów!

Książka "HTML5 i CSS3. Zaawansowane wzorce projektowe" zawiera opis ponad 350 wzorców projektowych w językach HTML5 i CSS3, przeznaczonych do budowy nowoczesnych stron internetowych. Każdy wzorzec można stosować w połączeniu z innymi, co daje nieskończoną liczbę możliwości udoskonalania produktów. Dzięki przedstawionym tu technikom nie trzeba stosować żadnych sztuczek i można uniknąć testowania w nieskończoność aplikacji w różnych przeglądarkach internetowych. Autorzy szczegółowo opisują wszystkie przydatne własności CSS3 oraz pokazują, jak połączyć je z kodem HTML5, aby uzyskać praktyczne rezultaty. Z książką tą nauczysz się tworzyć płynne układy stron, inicjały, uwagi na marginesie, cytaty i alerty. Ponadto poznasz wiele nowych technik, takich jak zaokrąglanie rogów i sprawdzanie danych wprowadzanych do formularzy.

Dzięki tej książce:

• poznasz najlepsze techniki tworzenia przejrzystego kodu HTML i CSS
• rozwiążesz typowe problemy z tworzeniem układów strony
• bezbłędnie sformatujesz tekst
• stworzysz kod tani w utrzymaniu!

O autorach (13)

O korektorze merytorycznym (15)

Podziękowania (17)

Wstęp (19)

• Adresaci (19)
  
• Innowacje (20)
  
• Konwencje (23)
  
• Korzystanie z tej książki (25)
  
• Jak podzielona jest książka (25)
  
• Kod źródłowy (27)
  
• Używanie kodu źródłowego (27)
  
• Kontakt z autorami (27)

Rozdział 1. Wzorce projektowe, czyli koniec problemów z CSS (29)

• Wzorce projektowe - przepisy strukturalne (30)
  
• Używanie wzorców projektowych (30)
  
• Używanie arkuszy stylów (35)
  
• Składnia CSS (36)
  
• Kaskadowość (40)
  
• Upraszczanie kaskady (42)
  
• Przydatne adresy (43)
  
• Często używane własności CSS (44)
  
• Własności i wartości CSS: ogólne (45)
  
• Własności i wartości CSS: treść (45)
  
• Własności i wartości CSS: układ (46)
  
• Własności i wartości CSS: specjalne (47)
  
• Selektory (47)
  
• Zapytania o media (48)
  
• Elastyczne jednostki miary (49)
  
• Stałe jednostki miary (50)
  
• Przeliczniki jednostek dla 96 dpi (50)
  
• Typowe rozmiary pisma przy 96 dpi (50)
  
• Przejścia, animacje i przekształcenia dwuwymiarowe (51)
  
• Rozwiązywanie problemów z CSS (52)
  
• Znormalizowany arkusz stylów (53)

Rozdział 2. Wzorce projektowe HTML (57)

• Streszczenie (57)
  
• Struktura HTML (58)
  
• Struktura HTML (60)
  
• XHTML (64)
  
• DOCTYPE (66)
  
• DOCTYPE (67)
  
• Elementy Nagłówka (69)
  
• Arkusz Warunkowy (71)
  
• Strukturalne Elementy Blokowe (73)
  
• Terminalne Elementy Blokowe (75)
  
• Wszechstronne Elementy Blokowe (77)
  
• Elementy Śródliniowe (79)
  
• Atrybuty Klasy i Identyfikatora (81)
  
• Białe Znaki w HTML (83)

Rozdział 3. Selektory i dziedziczenie w CSS (87)

• Streszczenie (87)
  
• Selektory Typu, Klasy i Identyfikatora (88)
  
• Selektory Pozycji i Grupowanie Selektorów (90)
  
• Selektory Atrybutów (92)
  
• Selektory Pseudoelementów (95)
  
• Selektory Pseudoklas (97)
  
• Selektor Podklasy (99)
  
• Dziedziczenie (101)
  
• Dziedziczenie Wizualne (103)

Rozdział 4. Modele polowe (105)

• Streszczenie (105)
  
• Rodzaje Pól (106)
  
• Model Polowy (108)
  
• Pole Śródliniowe (110)
  
• Pole Śródliniowo-Blokowe (112)
  
• Pole Blokowe (114)
  
• Pole Tabeli (116)
  
• Pole Pozycjonowane Bezwzględnie (118)
  
• Pole Pływające (120)

Rozdział 5. Określanie wymiarów pól (123)

• Streszczenie (123)
  
• Szerokość (124)
  
• Wysokość (126)
  
• Konkretny Rozmiar (128)
  
• Kurczliwy (130)
  
• Rozciągnięty (132)

Rozdział 6. Własności modelu polowego (135)

• Streszczenie (135)
  
• Margines (136)
  
• Obramowanie (138)
  
• Dopełnienie (141)
  
• Tło (143)
  
• Przepełnienie (145)
  
• Widoczność (147)
  
• Łamanie Stron (149)

Rozdział 7. Modele pozycjonowania (151)

• Streszczenie (151)
  
• Modele Pozycjonowania (152)
  
• Pozycjonowany (154)
  
• Najbliższy Pozycjonowany Przodek (156)
  
• Kontekst Stosowy (158)
  
• Wewnętrzny (160)
  
• Statyczny (162)
  
• Pozycjonowanie Bezwzględne (164)
  
• Pozycjonowanie Stałe (166)
  
• Pozycjonowanie Względne (168)
  
• Elementy Pływające (170)
  
• Względny Element Pływający (172)

Rozdział 8. Pozycjonowanie: wcinanie, przesuwanie i wyrównywanie elementów (175)

• Streszczenie (175)
  
• Wcięcia (176)
  
• Przesuwanie Elementów Statycznych (178)
  
• Przesuwanie i Wcinanie Statycznych Tabel (180)
  
• Przesuwanie Elementów Pływających (182)
  
• Przesuwanie Elementów Bezwzględnych i Stałych (184)
  
• Przesuwanie Elementów Względnych (186)
  
• Wyrównywanie Statycznych Elementów Śródliniowych (188)
  
• Wyrównywanie i Przesuwanie Statycznych Bloków (190)
  
• Wyrównywanie i Przesuwanie Statycznych Tabel (192)
  
• Wyrównywanie i Przesuwanie Elementów Bezwzględnych (194)
  
• Środkowanie Elementów Bezwzględnych (196)
  
• Wyrównanie Zewnętrzne (198)

Rozdział 9. Pozycjonowanie - techniki zaawansowane (201)

• Streszczenie (201)
  
• Wyrównanie do Lewej (202)
  
• Przesuwanie Elementów Wyrównanych do Lewej (204)
  
• Wyrównanie do Prawej (206)
  
• Przesuwanie Elementów Wyrównanych do Prawej (208)
  
• Wyrównanie do Środka (210)
  
• Przesuwanie Elementów Wyrównanych do Środka (212)
  
• Wyrównanie do Góry (214)
  
• Przesuwanie Elementów Wyrównanych do Góry (216)
  
• Wyrównanie do Dołu (218)
  
• Przesuwanie Elementów Wyrównanych do Dołu (220)
  
• Wyśrodkowanie Pionowe (222)
  
• Przesuwanie Elementów Wyśrodkowanych Pionowo (224)

Rozdział 10. Formatowanie tekstu (227)

• Streszczenie (227)
  
• Font (228)
  
• Wyróżnienie (230)
  
• Ozdoby Tekstu (232)
  
• Cień Tekstu (234)
  
• Zastępowanie Tekstu Grafiką (236)
  
• Zastępowanie Tekstu Kanwą i Obiektami VML (238)
  
• Osadzanie Fontów (240)
  
• Niewidoczny Tekst (241)
  
• Tylko dla Czytników Ekranu (242)

Rozdział 11. Stosowanie odstępów (245)

• Odstępy (246)
  
• Blokowy (248)
  
• Bez Zawijania (250)
  
• Zatrzymanie Białych Znaków (251)
  
• Kod (253)
  
• Dopełnienie Treści (255)
  
• Dystans Śródliniowy (257)
  
• Ozdoby Śródliniowe (259)
  
• Złamanie Wiersza (261)
  
• Śródliniowa Linia Pozioma (263)

Rozdział 12. Wyrównywanie treści (265)

• Wcięcie Tekstu (266)
  
• Wysunięcie Tekstu (267)
  
• Wyrównanie Treści w Poziomie (269)
  
• Pionowe Wyrównanie Treści (271)
  
• Przesuwanie Treści w Pionie (273)
  
• Indeks Górny i Dolny (275)
  
• Zagnieżdżanie Kontekstów Wyrównywania (277)
  
• Zaawansowany Przykład Wyrównywania (279)

Rozdział 13. Bloki (281)

• Streszczenie (281)
  
• Znaczenie Strukturalne (282)
  
• Struktura Wizualna (284)
  
• Sekcja (286)
  
• Listy (288)
  
• Punktory Graficzne (290)
  
• Śródliniowy (292)
  
• Scalanie Marginesów (294)
  
• Wsuwany (296)
  
• Pozioma Kreska (298)
  
• Odstęp między Blokami (300)
  
• Redukcja Odstępu między Blokami (301)
  
• Lewy Margines (303)
  
• Prawy Margines (305)

Rozdział 14. Obrazy (309)

• Streszczenie (309)
  
• Grafika (310)
  
• Mapa Obrazkowa (312)
  
• Gradient (314)
  
• Półprzezroczysty (316)
  
• Tekst Zastępowany (318)
  
• Treść nad Obrazem (319)
  
• Treść nad Obrazem Tła (321)
  
• Sprite'y CSS (323)
  
• Sprite'y CSS, kontynuacja (325)
  
• Obraz z Prostym Cieniem (327)
  
• Cień Obrazu (329)
  
• Cień Obrazu, kontynuacja (331)
  
• Cień Obrazu, kontynuacja (332)
  
• Zaokrąglone Rogi (334)
  
• Zaokrąglone Rogi, kontynuacja (336)
  
• Przykładowy Obraz (338)

Rozdział 15. Tabele (341)

• Streszczenie (341)
  
• Tabela (342)
  
• Grupowanie Wierszy i Kolumn (344)
  
• Selektory Tabel (346)
  
• Oddzielanie Krawędzi (348)
  
• Scalanie Krawędzi (350)
  
• Formatowanie Scalanych Krawędzi (351)
  
• Ukrywanie i Usuwanie Komórek (353)
  
• Ukrywanie i Usuwanie Wierszy i Komórek (355)
  
• Pionowe Wyrównanie Danych (357)
  
• Tabela w Paski (359)
  
• Tabelowy, Wierszowy i Komórkowy (361)
  
• Układ Tabeli (363)

Rozdział 16. Układy kolumn tabel (365)

• Modele układu tabel (365)
  
• Korzystanie z układów kolumn (366)
  
• Streszczenie (366)
  
• Szerokość Kolumny (368)
  
• Kurczliwe Kolumny (370)
  
• Kolumny o Stałej Szerokości (372)
  
• Kolumny Proporcjonalne do Treści (374)
  
• Kolumny Proporcjonalne do Innych Kolumn (376)
  
• Kolumny o Rozmiarach Procentowych (378)
  
• Kolumny o Odwróconych Proporcjach (380)
  
• Jednakowe Kolumny o Rozmiarze Treści (382)
  
• Kolumny o Takich Samych Rozmiarach (384)
  
• Niewyrośnięte Kolumny (386)
  
• Sprężyste Kolumny (388)
  
• Mieszane Układy Kolumn (390)

Rozdział 17. Układy stron (393)

• Streszczenie (393)
  
• Układy Płynne - Informacje Ogólne (394)
  
• Szerokość Zewnętrzna Pola (396)
  
• Projektowanie do wewnątrz, a projektowanie na zewnątrz (398)
  
• Pływająca Sekcja (400)
  
• Odstępy między Elementami Pływającymi (402)
  
• Układ Płynny (404)
  
• Naprzeciwległe Elementy Pływające (406)
  
• Formatowanie Zdarzeń (408)
  
• Sekcje Rozwijane (410)
  
• Menu z Zakładkami (413)
  
• Zakładki (417)
  
• Menu Rozwijane (421)
  
• Przycisk (425)
  
• Łącza Układowe (429)
  
• Układ Wielokolumnowy (431)
  
• Szablon (432)
  
• Przykładowy Układ (434)

Rozdział 18. Inicjały (439)

• Streszczenie (439)
  
• Wyrównany Inicjał (440)
  
• Inicjał (442)
  
• Wysunięty Inicjał (444)
  
• Inicjał z Grafiką i Dopełnieniem (446)
  
• Pływający Inicjał (448)
  
• Pływający Inicjał z Grafiką (450)
  
• Inicjał na Marginesie (452)
  
• Graficzny Inicjał na Marginesie (453)

Rozdział 19. Myśli przewodnie i cytaty (457)

• Streszczenie (457)
  
• Myśl Przewodnia Spływająca w Lewo (458)
  
• Myśl Przewodnia Spływająca w Prawo (460)
  
• Wyśrodkowana Myśl Przewodnia (462)
  
• Myśl Przewodnia na Lewym Marginesie (464)
  
• Myśl Przewodnia na Prawym Marginesie (466)
  
• Cytat Blokowy (468)
  
• Śródliniowy Cytat Blokowy (470)
  
• Cytat Śródliniowy (472)

Rozdział 20. Alerty (475)

• Streszczenie (475)
  
• Alert w JavaScript (476)
  
• Alert w Chmurce (478)
  
• Wyskakujący Alert (479)
  
• Wyskakujący Alert (481)
  
• Alert (483)
  
• Alert Śródliniowy (485)
  
• Wysunięty Alert (487)
  
• Alert Graficzny (489)
  
• Wsuwany Alert (491)
  
• Pływający Alert (493)
  
• Alert na Lewym Marginesie (495)
  
• Alert na Prawym Marginesie (497)
  
• Sprawdzanie Poprawności Formularzy (499)

Skorowidz (501)