Poznaj technologię, która zrewolucjonizowała projektowanie stron WWW.

• Definiowanie stylów dla tekstów i rysunków
• Pozycjonowanie elementów strony za pomocą stylów
• Dostosowywanie dokumentów do wyświetlania w różnych przeglądarkach

Kaskadowe arkusze stylów (CSS) całkowicie zmieniły sposób projektowania stron WWW. Formatowanie elementów za pomocą znaczników, żmudne rozmieszczanie ich w komórkach tabel oraz sztuczki, dzięki którym uzyskiwano efekt podświetlenia, to techniki uważane dziś już za przestarzałe. Wykorzystując technologię CSS możemy definiować wygląd każdego elementu umieszczonego na stronie. Przystosowanie strony do wyświetlania na ekranie telefonu komórkowego lub urządzenia PDA również nie stanowi problemu, jeśli zastosujemy do tego kaskadowe arkusze stylów. Opanowanie tej technologii jest dziś nieodzownym elementem wiedzy każdego projektanta witryn WWW.

Książka "CSS. Antologia. 101 wskazówek i trików" to zbiór porad dotyczących stosowania kaskadowych arkuszy stylów. Wykorzystując opisane w książce sposoby, zaprojektujesz estetyczne i efektywne witryny WWW i aplikacje internetowe. Czytając tę książkę, dowiesz się, jak definiować style dla elementów tekstowych i graficznych, w jaki sposób formatować tabele i formularze oraz jak stworzyć podświetlane przyciski bez korzystania z JavaScriptu. Przeczytasz tu również o pozycjonowaniu elementów strony za pomocą stylów, dostosowywaniu strony do wyświetlania w różnych przeglądarkach, systemach operacyjnych i urządzeniach. Poznasz także techniki umożliwiające uzyskanie "efektów specjalnych", które uatrakcyjnią wygląd Twojej witryny.

• Stosowanie stylów dla tekstu
• Przypisywanie stylów do elementów graficznych
• Budowanie mechanizmów nawigacyjnych
• Formatowanie tabel i formularzy
• Zachowanie zgodności witryny z różnymi modelami przeglądarek
• Definiowanie układu strony WWW za pomocą stylów
• Tworzenie efektów specjalnych

Spis treści:

Wstęp (9)

• Dla kogo przeznaczona jest ta książka? (10)
  
• Co zawiera ta książka? (10)
  
• Fora dyskusyjne SitePoint (11)
  
• Biuletyny SitePoint (12)
  
• Kontakt z nami (12)

Rozdział 1. CSS - od czego zacząć? (13)

• Problem z HTML (13)
  
• Definiowanie stylów w CSS (14)
  
• Selektory CSS (17)
  
• Podsumowanie (20)

Rozdział 2. Style tekstowe i inne techniki podstawowe (21)

• Jak zastąpić znacznik czcionki za pomocą CSS (21)
  
• Jak opisywać wielkość czcionki - za pomocą pikseli, punktów, emów czy innej jednostki (22)
  
• Jak zdefiniować czcionkę dla wyświetlanego tekstu (29)
  
• Jak usunąć podkreślenie z łączy do stron internetowych (30)
  
• Jak utworzyć łącze, którego kolor zmieni się po wskazaniu kursorem (32)
  
• Jak wyświetlić dwa różne style łącza na jednej stronie (34)
  
• Jak dodać kolor tła do nagłówka (36)
  
• Jak podkreślić tekst nagłówka (37)
  
• Jak usunąć odstęp pomiędzy nagłówkiem

  a występującym pod nim akapitem (38)
  

  Jak podświetlić tekst bez stosowania znaczników czcionki (39)
  

  Jak zmodyfikować odstęp między liniami tekstu (40)
  

  Jak wyjustować tekst (41)
  

  Jak nadać styl poziomej linii (42)
  

  Jak wprowadzić wcięcie w tekście (43)
  

  Jak wyśrodkować tekst (45)
  

  Jak za pomocą CSS zamienić wszystkie litery w tekście na wielkie (46)
  

  Jak zmienić lub usunąć znaki punktora na liście elementów (47)
  

  Jak zdefiniować punktor użytkownika (50)
  

  Jak usunąć wcięty lewy margines elementów listy (51)
  

  Jak wyświetlić elementy listy w poziomie (52)
  

  Jak dodać komentarz do kodu w pliku CSS (53)
  

  Jak usunąć marginesy bez dodawania atrybutów do znacznika

  (53)
  

  Podsumowanie (54)

Rozdział 3. CSS i rysunki (55)

• Jak dodać ramkę do rysunku (55)
  
• Czym w CSS zastąpić odradzany w specyfikacji HTML atrybut rysunków border (57)
  
• Jak za pomocą CSS zdefiniować tło w postaci rysunku (58)
  
• Jak zdefiniować położenie rysunku tła (61)
  
• Jak wstawić rysunek tła, który pozostanie nieruchomy w trakcie przewijania strony (63)
  
• Jak zdefiniować tło nie tylko dla strony WWW, ale także dla poszczególnych elementów (65)
  
• Jak umieścić tekst na rysunku (68)
  
• Jak zdefiniować w dokumencie więcej niż jedno tło (69)
  
• Podsumowanie (70)

Rozdział 4. Systemy nawigacji (71)

• Jak za pomocą CSS zastąpić system nawigacji oparty na rysunkach (72)
  
• Jak za pomocą CSS zmodyfikować listę elementów tak, aby wyglądała jak menu nawigacyjne (77)
  
• Jak za pomocą CSS uzyskać efekt najazdu bez użycia rysunków i JavaScript (81)
  
• Czy za pomocą CSS i list można stworzyć podmenu? (82)
  
• Jak utworzyć menu poziome za pomocą listy elementów i CSS (86)
  
• Jak za pomocą CSS utworzyć przyciski nawigacji (90)
  
• Jak w CSS utworzyć system nawigacji zawierający zakładki (92)
  
• Jak zmienić rodzaj kursora (99)
  
• Jak w CSS uzyskać efekt najazdu bez wykorzystania JavaScript (101)
  
• Podsumowanie (104)

Rozdział 5. Tabele (105)

• Jak za pomocą CSS wyświetlić dane z arkusza kalkulacyjnego (106)
  
• Jak zapewnić odpowiednią dostępność i atrakcyjność danych tabelarycznych umieszczonych na stronie internetowej (107)
  
• Jak dodać ramkę do tabeli, nie używając atrybutu HTML border (110)
  
• Jak usunąć odstępy pomiędzy komórkami tabeli po dodaniu ramek CSS (112)
  
• Jak wyświetlić dane tabelaryczne w atrakcyjny i praktyczny sposób (113)
  
• Jak wyświetlić w dwóch różnych kolorach wiersze tabeli (117)
  
• Jak zmienić kolor tła wiersza tabeli po wskazaniu go kursorem (120)
  
• Jak za pomocą CSS utworzyć kalendarz (122)
  
• Podsumowanie (132)

Rozdział 6. Formularze i elementy interfejsu użytkownika (133)

• Jak za pomocą CSS nadać styl elementom formularza (134)
  
• Jak definiować różne style dla pól tego samego formularza (137)
  
• Jak uniknąć automatycznego wstawiania w formularzu białych znaków i nowych linii (139)
  
• Jak sprawić, aby przycisk wysyłania wyglądał jak zwykły tekst (140)
  
• Jak umożliwić użytkownikom urządzeń tekstowych poprawne wypełnienie formularza (141)
  
• Jak wykonać dwukolumnowy układ formularza, nie stosując tabel (144)
  
• Jak utworzyć grupę dla powiązanych ze sobą pól (148)
  
• Jak nadać styl literom klawiszy dostępu (152)
  
• Jak zdefiniować kolory dla elementów listy rozwijanej (154)
  
• Jak za pomocą CSS sformatować formularz pozwalający wpisywać dane jak do arkusza kalkulacyjnego (155)
  
• Jak wyróżnić aktywne pole formularza (161)
  
• Podsumowanie (163)

Rozdział 7. Współpraca z przeglądarkami i urządzeniami przenośnymi (165)

• W jakich przeglądarkach powinienem testować projektowaną witrynę (166)
  
• Mam dostęp tylko do jednego systemu operacyjnego. Jak przetestować przeglądarki działające na innych systemach? (167)
  
• Czy istnieje usługa, która umożliwi mi sprawdzenie funkcjonalności projektowanej witryny w innych przeglądarkach? (170)
  
• Czy istnieje możliwość zainstalowania na jednym komputerze kilku wersji przeglądarki Internet Explorer? (171)
  
• Jak przetestować witrynę w przeglądarce tekstowej (173)
  
• Jak przetestować witrynę w aplikacji odczytującej na głos treść witryny (174)
  
• Jak ukryć formatowanie CSS w Netscape 4 (175)
  
• Jak stosować zróżnicowane style w Netscape 4 (177)
  
• Jak poinformować użytkowników przeglądarek w wersji 4 o zubożonym wyglądzie witryny (181)
  
• Jak ukryć kod CSS, aby nie był analizowany przez określone przeglądarki (183)
  
• Dlaczego moja witryna w przeglądarce Internet Explorer 6 wygląda inaczej niż w Mozilli? (189)
  
• Zdaje się, że znalazłem błąd w CSS! Co robić? (193)
  
• Część zawartości mojej witryny znika w przeglądarce Internet Explorer 6! Co się dzieje? (195)
  
• Co oznaczają komunikaty o błędach i komunikaty ostrzegawcze w narzędziu W3C Validator? (199)
  
• Jak utworzyć arkusz stylów dla określonych urządzeń, na przykład odczytujących na głos zawartość witryny lub zestawów WebTV (200)
  
• Jak utworzyć arkusz stylów przeznaczony do drukowania dokumentów (202)
  
• Niektóre przeglądarki umożliwiają użytkownikowi wybór arkusza stylów. W jaki sposób mogę dodać alternatywny arkusz stylów do swojej witryny? (211)
  
• Jak zastosować przełącznik arkuszy stylów (214)
  
• Jak stosować alternatywne arkusze stylów, nie powielając kodu (217)
  
• Podsumowanie (221)

Rozdział 8. Położenie elementów i modyfikacja układu strony za pomocą CSS (223)

• Kiedy stosować klasę, a kiedy ID (223)
  
• Jak sprawić, aby element sąsiadujący był wyświetlany jako blokowy i na odwrót (224)
  
• Jak w CSS funkcjonują odstępy i marginesy (226)
  
• Jak sprawić, aby rysunek był otaczany przez tekst, nie korzystając z atrybutu HTML align (229)
  
• Jak sprawić, aby inne elementy były wyświetlane pod elementem pływającym (232)
  
• Jak wyrównać logo i tytuł witryny, nie stosując tabeli (235)
  
• Jak za pomocą CSS zdefiniować położenie elementu na stronie (240)
  
• Jak umieścić blok na środku strony (243)
  
• Jak utworzyć przejrzysty, dwukolumnowy układ zawierający z lewej strony menu, a z prawej główną treść (246)
  
• Czy można odwrócić ten układ i umieścić menu po prawej stronie? (252)
  
• Jak stworzyć dwukolumnowy, wyśrodkowany układ o zdefiniowanej szerokości (253)
  
• Jak za pomocą CSS stworzyć trzykolumnowy układ strony (264)
  
• Jak za pomocą CSS dodać stopkę, która będzie prawidłowo wyświetlana w każdych warunkach (275)
  
• Jak wyświetlić galerię miniatur zdjęć, nie stosując tabeli (281)
  
• Podsumowanie (286)

Rozdział 9. Specjalne techniki CSS (287)

• Jak stworzyć kolorowe paski przewijania (287)
  
• Jak utworzyć menu, które będzie widoczne nawet po przewinięciu zawartości strony (289)
  
• Jak uzyskać nieruchome menu w przeglądarce Internet Explorer (293)
  
• Czy za pomocą CSS mogę utworzyć stopkę, która pozostaje nieruchoma jak ramka? (297)
  
• Czy można wyłącznie za pomocą CSS utworzyć menu rozwijane? (304)
  
• Czy w CSS można zaokrąglić narożniki ramek? (309)
  
• Jak za pomocą CSS uzyskać efekt zaokrąglonych narożników, który będzie działał w przeglądarkach innych niż Mozilla (311)
  
• Jak w przeglądarkach Mozilla i Internet Explorer stworzyć półprzezroczyste elementy (317)
  
• Jak za pomocą CSS wyróżnić zewnętrzne łącza (320)
  
• Czy można użyć CSS do wstawiania tekstu do dokumentu? (322)
  
• Jak zdefiniować styl dla pierwszej linii lub pierwszej litery w bloku (323)
  
• Czy stosowanie efektów, które nie działają w niektórych przeglądarkach, to coś złego? (327)
  
• Podsumowanie (327)

Skorowidz (329)