. Video-Lektionen auf DVD. 12
1. Auf die Plätze. 18
. 1.1. Wozu CSS lernen. 18
. 1.2. Wem nützt dieses Buch. 19
. 1.3. Wie funktioniert dieses Buch. 19
2. Was Sie wissen sollten. 24
. 2.1. Was sind Webstandards. 24
. 2.2. Was ist das W3C. 25
. 2.3. Was ist eine Webseite. 25
. 2.4. Was ist HTML. 26
. 2.5. Was ist XHTML. 27
. 2.6. Was ist CSS. 28
. 2.7. Was bedeutet Browserkompatibilität. 29
. 2.8. Was versteht man unter Usability. 30
. 2.9. Wie sorgt man für Accessibility. 30
. 2.10. Wozu tabellenfreies Design. 31
3. Was Sie können sollten. 34
. 3.1. HTML-Grundlagen. 34
. 3.2. Upload von Dateien -- FTP. 35
. 3.3. Grundkenntnisse in Englisch. 35
4. Was Sie verwenden sollten. 38
. 4.1. Editoren. 38
. 4.2. Browser-Erweiterungen. 39
. 4.3. Foren. 40
5. Was Sie verstehen sollten. 42
. 5.1. Der Aufbau einer XHTML-Datei. 42
. 5.2. Die wichtigsten Regeln für XHTML. 46
. 5.3. HTML-Elemente. 47
. 5.4. Schreibweisen in (X)HTML. 48
. 5.5. Der Aufbau einer CSS-Datei. 49
. 5.6. Die wichtigsten Regeln für CSS. 49
. 5.7. CSS-Selektoren. 50
. 5.8. Schreibweisen in CSS. 51
. 5.9. Verkürzte Schreibweise von Eigenschaften. 52
. 5.10. XHTML und CSS miteinander verbinden. 56
6. Der erste Entwurf. 64
. 6.1. Die XHTML-Datei -- Struktur und Inhalt der Webseite. 64
. 6.2. Die CSS-Datei -- Formen und Farben der Webseite. 70
. 6.3. Browsercheck -- ganz schnell. 73
. 6.4. Lorem ipsum -- provisorischer Inhalt. 75
7. Die drei Säulen von CSS: 1.Die Selektoren. 78
. 7.1. Der Universal-Selektor. 78
. 7.2. Typ-Selektoren (Element-Typ-Selektoren, auch HTML-Selektoren. 79
. 7.3. ID-Selektoren. 80
. 7.4. Klassen-Selektoren. 81
. 7.5. Pseudoklassen. 84
. 7.6. Pseudoelemente. 86
. 7.7. Attribut-Selektoren. 87
. 7.8. Kombinatoren. 87
. 7.9. Gruppieren von Deklarationen. 88
. 7.10. Gruppieren von Selektoren. 89
. 7.11. Klassennamen und ID-Namen. 90
. 7.12. Spanitis, Divitis, Klassitis -- gefürchtete Seuchen. 90
8. Die drei Säulen von CSS: 2.Das Boxmodell. 94
. 8.1. Block-Element versus Inline-Element. 95
. 8.2. Das IE 5-Boxmodell. 97
. 8.3. display -- Element-Anzeige ändern. 101
9. Die drei Säulen von CSS: 3.Positionierung. 104
. 9.1. position: static. 104
. 9.2. Normal Flow. 105
. 9.3. top, right, bottom, left. 106
. 9.4. position: relative. 106
. 9.5. position: absolute. 108
. 9.6. position: fixed. 109
. 9.7. z-index. 109
. 9.8. float und clear. 110
. 9.9. clear. 112
10. Die Grundeinstellungen. 114
. 10.1. Browser-Style sheets ganz einfach anpassen. 114
. 10.2. Scrollbalken erzwingen. 114
. 10.3. Bereiche einteilen und floaten. 116
. 10.4. Seite zentrieren in drei Schritten. 117
11. Die Navigation. 122
. 11.1. Navigation horizontal. 122
. 11.2. Menü vertikal. 126
. 11.3. font -- Schriften benutzerfreundlich voreinstellen. 130
. 11.4. background -- Farben und Bilder als Hintergrund. 134
12. Mehr Design mit CSS. 142
13. Bilder einsetzen und gestalten. 148
14. Inhalte strukturieren und formatieren. 154
. 14.1. font, text, paragraph -- Schriften und Text. 154
. 14.2. anchor -- Links im Text gestalten. 156
. 14.3. h1 bis h6 -- noch mehr Design für Überschriften. 159
. 14.4. strong, em -- fett und betont. 164
. 14.5. span -- das Inline-Pendant zu div. 165
. 14.6. ol und li -- nummerierte Listen. 166
. 14.7. blockquote, cite -- Textkästchen mit Quelle. 169
. 14.8. definition, sample -- Zitat, Definition, Beispiel. 172
. 14.9. dl -- noch mehr Listen. 172
. 14.10. horizontal rule -- horizontale Linie. 174
15. Tabellen für Zahlen und Daten. 178
16. Formulare formschön gestalten. 186
17. CSS und Medien: Ein Style sheet für den Druck. 194
. 17.1. Verknüpfung von Media-Style sheets. 195
. 17.2. Style sheets für Medientypen. 197
. 17.3. Checkliste für Druck-Style sheets. 197
18. Kaskade, Spezifität und Vererbung -- die lieben Verwandten. 204
. 18.1. Kaskade -- wer kommt zuerst. 204
. 18.2. Spezifität -- wer gewinnt. 207
. 18.3. Vererbung -- und wer erbt was. 210
19. Grundsätzliche Überlegungen. 216
. 19.1. Usability -- seien Sie freundlich zu Ihren Besuchern. 216
. 19.2. Schriften unter der Lupe. 218
. 19.3. Fix oder Flex. 218
. 19.4. Design -- die Kunst liegt im Weglassen. 219
20. Eine Basisvorlage für alle Fälle. 224
. 20.1. Der Basis-HTML-Code häppchenweise. 225
. 20.2. Der Basis-CSS-Code häppchenweise. 227
. 20.3. Variante mit flexibler Breite. 232
21. Vorlage #1: Eine Spalte. 236
. 21.1. Variante mit fixer Breite. 236
. 21.2. Designvorschläge. 239
. 21.3. Variante mit flexibler Breite. 243
. 21.4. Anwendungsbeispiele für einspaltige Layouts. 243
22. Navigieren mit Tabs. 248
. 22.1. Einfache Tab-Leiste mit Rollover-Effekt. 248
. 22.2. Einfache Tab-Leiste mit Verlauf und Rollover. 251
. 22.3. Tab-Leiste mit Pfeil für Rollover. 256
. 22.4. Anwendungsbeispiele für Tab-Navigation. 259
23. Vorlage #2: Zwei Spalten. 262
. 23.1. Menü rechts. 263
. 23.2. Menü links. 265
. 23.3. Ein einfacher Style-Switcher. 266
. 23.4. Variante mit Navigation. 268
. 23.5. Variante Menüpunkte. 269
. 23.6. Variante mit Hintergrundbildern. 270
. 23.7. Anwendungsbeispiele für ein 2-Spalten-Layout. 271
24. Vorlage #3: Drei Spalten mit Textboxen. 274
. 24.1. Varianten für Textboxen. 278
. 24.2. Variante mit drei Spalten, alle fluid. 283
. 24.3. Variante mit schmalen Spalten rechts. 285
. 24.4. Anwendungsbeispiele für 3-Spalten- Layouts. 286
25. Vorlage #4: Vier Spalten. 290
. 25.1. Variante mit drei Spalten rechts fix, Textspalte links fluid. 291
. 25.2. Anwendungsbeispiele für 4-Spalten- Layouts. 293
26. Vorlage #5: Drei Spalten mit Galerie. 296
27. Vorlage #6: Frames oben und links. 302
. 27.1. Varianten für das Design. 309
28. Vorlage #7: Formular in Spalten. 314
. 28.1. Modul 1: Namen und Adresse -- Radio-Buttons und Textfelder. 315
. 28.2. Modul 2: Gemischte Daten -- Radio- Buttons und Checkboxen. 322
. 28.3. Modul 3: Nachrichtenfeld und Senden -- Textarea und Submit-Button. 324
29. Elemente zentrieren. 328
. 29.1. Elemente horizontal zentrieren. 328
. 29.2. Elemente vertikal zentrieren. 330
30. CSS-Code optimieren. 334
. 30.1. Vor der Erstellung von Style sheets. 334
. 30.2. Nach dem Anlegen Ihres Projektes. 342
. 30.3. Tools zur Optimierung von CSS-Code. 344
31. CSS-Code validieren und Fehlersuche. 348
. 31.1. W3C-Validatoren. 348
. 31.2. Firefox-Erweiterung Web Developer. 353
. 31.3. Web Development Bookmarklets. 354
32. Browserkompatibilität testen. 358
33. Was tun gegen Browserbugs. 364
. 33.1. Hacks, Workarounds, Filter -- die Begriffe. 364
. 33.2. Das Problem mit Hacks und dergleichen. 365
. 33.3. Grundsätzliche Überlegungen. 366
. 33.4. Vorgehen bei einem vermeintlichen Bug. 366
. 33.5. Conditional Comments. 367
. 33.6. Der Star-Selektor-Hack. 372
34. CSS-Eigenschaften A--Z. 378
35. CSS: Maßeinheiten und Werte. 402
. 35.1. Schlüsselbegriffe. 402
. 35.2. Längenangaben. 402
. 35.3. Farben. 407
36. Nützliche Checklisten. 410
. 36.1. Checkliste für die Webproduktion. 410
. 36.2. Checkliste der 'beliebtesten' Fehler in (X)HTML. 412
. 36.3. Checkliste der 'beliebtesten' Fehler in CSS. 413
37. Meine liebsten Tools. 416
38. CSS-Frameworks und YAML. 422
. 38.1. Was sind CSS-Frameworks. 422
. 38.2. Was ist YAML. 423
. 38.3. Andere CSS-Frameworks. 423
. 38.4. Vor- und Nachteile von CSS-Frameworks. 427
. 38.5. Die wichtigsten 'Pros und Contras. 427
. 38.6. CSS-Frameworks -- ganz persönlich betrachtet. 428
. Inhalt der DVD-ROM. 432
. Übungsdateien zum Buch. 432
. Programme und Tools. 432
. Video-Training. 433
. Index. 435
