Einstieg in CSS. Galileo Computing

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

"Für Anfänger das perfekte Einsteigerwerkzeug. Wetsch bringt angehenden Entwicklern von Webseiten Schritt für Schritt CSS bei." (YellowTAB 2010)

Nie war es anschaulicher CSS zu lernen! Wenn Sie bereits über grundlegende (X)HTML-Kenntnisse verfügen und nun Ihren Webseiten mit Cascading Stylesheets den nötigen Schliff verpassen wollen, sind Sie mit diesem Buch richtig. Elisabeth Wetsch bereitet Sie in leicht nachvollziehbaren Schritten auf den Innenausbau Ihrer Website mit CSS vor. Auf der Tagesordnung stehen professionelle Layouts, universell einsetzbare und kreative Vorlagen sowie ein Referenzteil, den Sie immer wieder zur Hand nehmen können.
Von den Grundlagen bis hin zur Erstellung komplexer, mehrspaltiger Seitenlayouts bringt dieses Buch alles mit, was Sie für das Design Ihrer Website benötigen.

Elisabeth Wetsch 

Programmiersprachen CSS ( Cascading Style Sheets ) Computers / General Cascading Style Sheets - CSS 

The Art of Right Spelling and Pronouncing All the Words of the English Tongue Very Useful for All Persons That Are Desirous to Learn to Write Properly  Lake Effect: A Deckhand's Journey on the Great Lakes Freighters  Hitchhiking After Dark: Offbeat Stories from a Small Town  Oxbridge Directory of Newsletters  Shadows of Destiny  Encyclopedia of the New American Nation  Feminist Literature: A Gale Critical Companion