CSS_wedlug_Erica_Meyera_Kolejna_odslona_cssods.pdf

(1478 KB) Pobierz
IDZ DO
PRZYK£ADOWY ROZDZIA£
SPIS TRE CI
KATALOG KSI¥¯EK
KATALOG ONLINE
ZAMÓW DRUKOWANY KATALOG
CSS wed³ug Erica
Meyera. Kolejna ods³ona
Autor: Eric A. Meyer
T³umaczenie: Wojciech Moch
ISBN: 83-7361-901-1
Tytu³ orygina³u:
More Eric Meyer on CSS
Format: B5, stron: 270
Przyk³ady na ftp: 1082 kB
TWÓJ KOSZYK
DODAJ DO KOSZYKA
Technologia kaskadowych arkuszy stylów (CSS) stopniowo wypiera inne metody
definiowania uk³adu i wygl¹du witryn WWW. Uniwersalno æ i elastyczno æ stylów CSS
sprawiaj¹, ¿e zmiana kolorystyki, liternictwa i konstrukcji strony sprowadza siê do
zmodyfikowania arkusza definiuj¹cego wygl¹d okre lonych elementów. W ksi¹¿ce
„CSS wed³ug Erica Meyera. Sztuka projektowania stron WWW” autor — prawdziwy guru
projektantów witryn WWW — przedstawi³ czytelnikom zasady poprawnego stosowania
stylów w projektach. Nadszed³ czas na wykorzystanie wiedzy w praktyce.
„CSS wed³ug Erica Meyera. Kolejna ods³ona” to doskona³a pozycja dla wszystkich,
którzy chc¹ poznaæ technologiê CSS na praktycznych przyk³adach. Czytaj¹c j¹
i wykonuj¹c opisane w niej projekty, przekonasz siê, jakim u³atwieniem dla projektanta
stron WWW s¹ kaskadowe arkusze stylów. W kolejnych rozdzia³ach przeczytasz
o konwertowaniu „starych” stron WWW na dokumenty oparte o CSS, wykorzystywaniu
stylów do formatowania witryn WWW i projektowaniu z wykorzystaniem
najnowocze niejszych technologii definiowania wygl¹du i uk³adu strony. Poznasz
sposoby przygotowywania atrakcyjnych i uniwersalnych witryn WWW, które zostan¹
prawid³owo wy wietlone we wszystkich przegl¹darkach i na ró¿nych urz¹dzeniach.
O autorze:
Eric A. Meyer
zajmuje siê projektowaniem witryn i zagadnieniami zwi¹zanymi z sieci¹
WWW od koñca 1993 roku. Jest g³ównym konsultantem firmy Complex Spiral
Consulting (www.complexspiral.com). Mieszka w Cleveland w stanie Ohio. Ukoñczy³
Uniwersytet Case Western Reserve, na którym przez pewien czas pe³ni³ funkcjê
webmastera. Obecnie jest ekspertem wspó³pracuj¹cym z grup¹ robocz¹ W3C CSS&FP.
By³ jednym z autorów i koordynatorów zestawu testów W3C CSS1. Czêsto bierze udzia³
w konferencjach, omawiaj¹c CSS, projektowanie stron WWW, standardy sieci WWW
oraz przegl¹darki WWW. Jest te¿ autorem ksi¹¿ek CSS wed³ug Erica Meyera, CSS.
Kaskadowe arkusze stylów. Przewodnik encyklopedyczny, CSS 2.0 Programme’s
Reference, a tak¿e s³ynnych tabel porównania zgodno ci przegl¹darek ze specyfikacj¹ CSS.
CENNIK I INFORMACJE
ZAMÓW INFORMACJE
O NOWO CIACH
ZAMÓW CENNIK
CZYTELNIA
FRAGMENTY KSI¥¯EK ONLINE
Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl
S
PIS TREŚCI
O Autorze ........................................................................................................ 9
O Recenzentach technicznych ...........................................................................10
Przedmowa .................................................................................................... 11
Wprowadzenie ................................................................................................15
PROJEKT 1. Przekształcanie istniejącej strony .....................................................................21
Cele projektu ..........................................................................................................................................................22
Przygotowania ........................................................................................................................................................22
Kładziemy fundamenty ......................................................................................................................................23
Konwertowanie dokumentu .............................................................................................................................24
Okrajanie dokumentu ..................................................................................................................................25
Struktura szkieletowa ..................................................................................................................................25
Przebudowa projektu ...........................................................................................................................................28
Style podstawowe .........................................................................................................................................28
Składanie nagłówka ......................................................................................................................................28
Wypełnianie paska nawigacyjnego .........................................................................................................30
Style tytułu i podsumowania ....................................................................................................................33
Informacje z boku strony ...........................................................................................................................35
Stylizowana recenzja ...................................................................................................................................38
Wyróżnianie cytatu i rozbudowa projektu ..........................................................................................40
Powrót do nagłówka .....................................................................................................................................42
Ocena korzyści .......................................................................................................................................................46
Drobna uwaga ................................................................................................................................................47
Warianty ...................................................................................................................................................................48
PROJEKT 2. Stylizowanie kolekcji zdjęć ............................................................................... 49
Cele projektu ..........................................................................................................................................................50
Przygotowania ........................................................................................................................................................50
Kładziemy fundamenty ......................................................................................................................................51
Tworzenie widoku arkusza prezentacji ........................................................................................................52
Opływanie ........................................................................................................................................................52
Odstępy i centrowanie .................................................................................................................................53
Style i slajdy ....................................................................................................................................................55
Tworzenie widoku galerii ..................................................................................................................................57
Usuwanie stylów slajdów ...........................................................................................................................57
Tytuły, tytuły, tytuły ....................................................................................................................................58
Czyszczenie .....................................................................................................................................................60
Wysokość i tabele ..........................................................................................................................................61
6
Tworzenie widoku katalogu ..............................................................................................................................62
Znów opływanie ............................................................................................................................................63
Ułożenie i wyrównanie ...............................................................................................................................65
Poprawianie listy ...........................................................................................................................................67
Informacje do ramek ....................................................................................................................................69
Warianty ...................................................................................................................................................................71
PROJEKT 3. Stylizowanie raportu finansowego .................................................................... 73
Cele projektu ..........................................................................................................................................................74
Przygotowania ........................................................................................................................................................74
Style dla ekranu .....................................................................................................................................................74
Kładziemy fundamenty ..............................................................................................................................75
Style czcionek .................................................................................................................................................76
Etykiety tabeli .................................................................................................................................................78
Style zysków ...................................................................................................................................................80
Akcentowanie wartości ujemnych ..........................................................................................................81
Style podsumowania ....................................................................................................................................82
Ostatnie poprawki .........................................................................................................................................84
Style do wydruku ..................................................................................................................................................86
Zaczynamy .......................................................................................................................................................86
Zaznaczanie wierszy ....................................................................................................................................87
Wiersz podsumowania ................................................................................................................................89
Warianty ...................................................................................................................................................................91
PROJEKT 4. Pozycjonowanie w tle .....................................................................................93
Cel projektu .............................................................................................................................................................94
Przygotowania ........................................................................................................................................................94
Style o poranku ......................................................................................................................................................94
Zaczynamy .......................................................................................................................................................94
Style nagłówka ...............................................................................................................................................96
Czyszczenie .................................................................................................................................................. 100
Style na plaży ....................................................................................................................................................... 102
Ocena struktury i stylów ......................................................................................................................... 102
Style tytułu ................................................................................................................................................... 104
Style treści .................................................................................................................................................... 105
Dodawanie tła .............................................................................................................................................. 107
Wszystkie za i przeciw ............................................................................................................................. 109
Warianty ................................................................................................................................................................ 111
PROJEKT 5. Menu tworzone na podstawie list ....................................................................113
Cele projektu ....................................................................................................................................................... 114
Przygotowania ..................................................................................................................................................... 114
Kładziemy fundamenty ................................................................................................................................... 114
Sprawdzanie kodu ...................................................................................................................................... 115
Troszkę przestrzeni ........................................................................................................................................... 116
Rozdzielenie ................................................................................................................................................. 117
Styl ze strzałką ............................................................................................................................................ 118
Stylizowanie łączy ..................................................................................................................................... 120
7
Zamykanie łączy ................................................................................................................................................. 124
Zmiany ........................................................................................................................................................... 124
Łącza w ramkach ........................................................................................................................................ 125
Zawiesić na linie ......................................................................................................................................... 126
Warianty ................................................................................................................................................................ 130
PROJEKT 6. Menu rozwijalne tworzone za pomocą CSS ..................................................... 133
Cele projektu ....................................................................................................................................................... 134
Przygotowania ..................................................................................................................................................... 134
Kładziemy fundamenty ................................................................................................................................... 134
Układanie menu ................................................................................................................................................. 136
Planowanie .................................................................................................................................................... 136
Pozycjonowanie menu podrzędnych .................................................................................................. 138
Style ładniejszych menu .......................................................................................................................... 139
Grupowanie łączy ...................................................................................................................................... 140
Pozycje wskazywane ................................................................................................................................. 143
Specjalne style podrzędnych menu ..................................................................................................... 144
Przygotowywanie menu rozwijalnego ............................................................................................... 145
Ostatnie poprawki ...................................................................................................................................... 148
Zmiana układu menu ........................................................................................................................................ 149
Zmiana orientacji ....................................................................................................................................... 150
Wprowadzanie poprawek ........................................................................................................................ 152
Poprawki w menu niższych poziomów ............................................................................................. 154
Pod rozwagę ......................................................................................................................................................... 156
Warianty ................................................................................................................................................................ 157
PROJEKT 7. Tworzenie atrakcyjnych zakładek ....................................................................159
Cele projektu ....................................................................................................................................................... 160
Przygotowania ..................................................................................................................................................... 160
Kładziemy fundamenty ................................................................................................................................... 161
Stylizowanie łączy ............................................................................................................................................. 164
Początkowe style ........................................................................................................................................ 164
Poprawianie wyglądu zakładek ............................................................................................................. 166
Dodawanie tekstury .................................................................................................................................. 170
Wskazywanie i ostatnie poprawki ........................................................................................................ 171
Obcięty tekst i zmniejszony obszar aktywny ................................................................................... 172
Tworzenie rzeczywistych zakładek ............................................................................................................ 175
Wprowadzanie zmian ............................................................................................................................... 176
Zakładki ......................................................................................................................................................... 177
Wyróżnianie aktualnej zakładki ............................................................................................................ 179
Końcowe uwagi .......................................................................................................................................... 182
Warianty ................................................................................................................................................................ 184
PROJEKT 8. Stylizacja bloga ..............................................................................................187
Cele projektu ....................................................................................................................................................... 188
Przygotowania ..................................................................................................................................................... 188
Kładziemy fundamenty ................................................................................................................................... 188
8
Stylizowanie bloga ............................................................................................................................................. 190
Zabawy z tytułem ....................................................................................................................................... 190
Tytuł i data wpisu ...................................................................................................................................... 194
Rozdzielanie i łączenie ............................................................................................................................. 195
Tekst i informacje ...................................................................................................................................... 198
Ostatnie poprawki ...................................................................................................................................... 202
Warianty ................................................................................................................................................................ 205
PROJEKT 9. Tworzenie strony domowej ...........................................................................207
Cele projektu ....................................................................................................................................................... 208
Przygotowania ..................................................................................................................................................... 208
Kładziemy fundamenty ................................................................................................................................... 208
Tworzenie projektu ........................................................................................................................................... 210
Dwa obrazki za nagłówkiem .................................................................................................................. 210
Przesunięcia i ramki .................................................................................................................................. 213
Zawartość i pasek boczny ....................................................................................................................... 214
Proste style paska bocznego ................................................................................................................... 218
Kolejny listek ............................................................................................................................................... 219
Łącza paska bocznego .............................................................................................................................. 221
Zmiany ramek .............................................................................................................................................. 223
Naturalne wyróżnienie ............................................................................................................................. 224
Ostatnie modyfikacje ................................................................................................................................ 225
Warianty ................................................................................................................................................................ 229
PROJEKT 10. Projektowanie ogrodu ................................................................................... 231
Cele projektu ....................................................................................................................................................... 232
Przygotowania ..................................................................................................................................................... 233
Kładziemy fundamenty ................................................................................................................................... 233
Tworzenie projektu ........................................................................................................................................... 235
Ziarna i sadzonki ........................................................................................................................................ 236
Nagłówek strony ........................................................................................................................................ 237
Dodajemy kwiat .......................................................................................................................................... 238
Stylizowanie podsumowania ................................................................................................................. 241
Stylizowanie właściwej zawartości dokumentu ............................................................................. 244
A teraz stopka .............................................................................................................................................. 248
Style paska bocznego ................................................................................................................................ 252
Dodajemy obrazki PNG .................................................................................................................................. 259
Przemyślenia ........................................................................................................................................................ 262
Warianty ................................................................................................................................................................ 264
Skorowidz ....................................................................................................265
Zgłoś jeśli naruszono regulamin