Auf einen Blick. Vorwort Einführung in CSS Grundlegende Konzepte von CSS Die Zukunft von CSS Browser-Kompatibilität 97

Transkript

1 Auf einen Blick Vorwort 13 1 Einführung in CSS 17 2 Grundlegende Konzepte von CSS 41 3 Die Zukunft von CSS 81 4 Browser-Kompatibilität 97 5 CSS in der Praxis Beispiele Tools für CSS Die CSS-Elemente 391 A Die CD-ROM zum Buch 541 B Die Website zum Buch 543 C Die Referenzkarte 545 D Glossar 547 Index 555

2 Inhalt Vorwort 13 1 Einführung in CSS Von HTMLzuCSS Was sind CSS? Kurze Geschichte der CSS Wie sehen CSS aus? »Hallo Welt!«auf CSS Vorteile und Grenzen des CSS-Einsatzes 39 2 Grundlegende Konzepte von CSS Selektoren Einfache Elementselektoren Kombinierte Selektoren Class- und ID-Selektoren Kind-Selektoren (CSS2) Folgeelement-Selektoren (CSS2) Attribut-Selektoren (CSS2) CSS3-Selektoren und-elemente Tabellen-Selektoren Pseudo-Klassen und Pseudo-Elemente Universal-Selektor Vererbung Rangfolge und Kaskadierung Die Important-Anweisung Einbindung von Stylesheets in HTML-Dateien Stil-Anweisungen im HTML-Tag Stil-Anweisungen im Dokumentenkopf Verlinkte Stylesheets Importierte Stylesheets Medienspezifische Stylesheets (CSS2) Die Kastenform (Box Model) Benennungen und Werte für Stylesheets Namen für Stylesheets, Klassen und IDs Längen- und Größenangaben Prozentwerte (%) 76 Inhalt 5

3 2.6.4 Farben URLs (url) Schlüsselwörter CSS-Kommentare 78 3 Die Zukunft von CSS CSS CSS XHTML, XML und CSS Von HTML zu X(H)TML XML und CSS CSS nicht nur im Browser Screenreader PDAs und Mobiltelefone 95 4 Browser-Kompatibilität Einzelne Browser Mosaic, Netscape Navigator 3.x und früher, Internet Explorer 2.x und früher Netscape Navigator 4.x Netscape Navigator 6 (Mozilla 0.x) Netscape Navigator 7 (Mozilla 1.0) Mozilla Firefox Internet Explorer Internet Explorer Internet Explorer 5.x Internet Explorer Opera Opera 5/ Opera Konqueror Safari Lynx Weitere Browser Browseranteile Doctypes und Doctype-Switching Browserweichen und -Hacks Sternchen-Hack Box Model Hack Vereinfachter Box Model Hack und Erweiterter Vereinfachter Box Model Hack Hochpass-Filter Inhalt

4 4.4.6 media-attribut Kommentar-Trick Selektoren-Tricks OperaCatcher le/mac-filter Conditional Comments Browser-Sniffer Hacks selber entwickeln 130 CSS in der Praxis Strategien für den CSS-Designer Valide Dokumente erstellen CSS zur Schriftgestaltung-»Weicher CSS-Einsatz« Komplettlayout mit CSS-»Harter CSS-Einsatz« Entwurfsverfahren für CSS-Sites Fehlersuche in CSS-Dateien Suchmaschinenoptimierung per CSS Zugängliche Websites mit CSS (Accessibility) Schriftgrößen Schlüsselwörter Relative Angaben Punkte Pixel Gemischte Angaben Fontsizer (einfach-fuer-alle.de) CSS-Layouts Positionierungsvarianten CSS-Layouts Zentrierter Inhalt Feststehende Bereiche CSS-Frames CSS-Menüs Dynamische Menüs mit CSS CSS-Menüs mit Listen Bildergalerie Schönere Formulare Druckversion per CSS Stylesheet-Wechsler Simpler Styleswitcher mit HTML-Mitteln Styleswitcher mit JavaScript Styleswitcher mit PHP JavaScript mit Sicherheitsnetz Browserweiche für Stylesheets 269 Inhalt 7

5 6 Beispiele Aktion Mensch: Einfach für Alle EfA EfA EfA Der Code von Einfach für Alle Lycos Deutschland CSS Zen Ocean - ein Beispiellayout für den Zen Garden Tools für CSS CSS-Editoren TopStyle Style Studio Cascade Morphon CSS-Editor Style Master Dreamweaver MX GoLive CS CSS-Werkzeuge und weitere Tools User-Stylesheets Tidy OpTool Calipers IrfanView Web-Designer-Toolbar Die CSS-Elemente Alphabetische Übersicht Pseudo-Elemente und Pseudo-Formate :link :visited :hover (CSS2) :focus (CSS2) :active :lang (CSS 2) :first-line :first-letter :first-child (CSS2) :before und :after (CSS2) :not (CSS3) Inhaltserzeugung content (CSS2, Änderung in CSS 2.1) Inhalt

6 8.3.2 countero und counterso counter-increment (CSS2) counter-reset (CSS2) quotes (CSS2) Schriftformatierungen font-family font-style font-variant font-weight font-size font-size-adjust (CSS, nicht in CSS 2.1) font-stretch (CSS2, nicht in CSS 2.1) font 429 (CSS2, nicht in CSS 2.1) text-decoration text-shadow (CSS2, nicht in CSS 2.1) text-transform letter-spacing word-spacing (CSS2) white-space line-height text-indent text-align (Änderung in CSS 2.1) vertical-align direction (CSS2) unicode-bidi (CSS2) Farben und Hintergründe color background-color background-image background-repeat background-attachment background-position (Änderung in CSS 2.1) background Kastenformatierungen margin padding border-width border-color border-style border width height overflow (CSS2) clip (CSS2, Änderung in CSS 2.1) float clear position (CSS2) box-sizing (CSS3) top (CSS2) 492 Inhalt 9

7 right (CSS2) bottom (CSS2) left (CSS2) visibility (CSS2) opacity (CSS3) z-index (CSS2) list-style-type list-style-image list-style-position list-style Anzeigemodus display (CSS1, Erweiterung in CSS2 - table, Änderung in CSS 2.1, Erweiterung in CSS3 - icon) Tabellenformatierungen table-layout (CSS2) caption-side (CSS2, Änderung in CSS 2.1) border-collapse (CSS2, Änderung in CSS 2.1) border-spacing (CSS2) empty-cells (CSS2) speak-header (CSS2) Benutzeroberfläche Cursor (CSS2) outline (CSS2) scrollbars (MS-proprietär, kein offizieller CSS-Bestandteil) filter (MS-proprietär, kein offizieller CSS-Bestandteil) Seitenlayout mit (a)page (CSS2) size (CSS2, nicht in CSS 2.1) marks (CSS2, nicht CSS 2.1) lieft :right :first (CSS2) page-break-before, page-break-after (CSS2) page-break-inside (CSS2) page (CSS2, nicht CSS 2.1) orphans (CSS2) widows (CSS2) Sprachausgabe speak (CSS2, Änderung in CSS 2.1) volume (CSS2, Änderung in CSS 2.1) speech-rate (CSS2, Änderung in CSS 2.1) pause (CSS2, Änderung in CSS 2.1) cue (CSS2, Änderung in CSS 2.1) play-during (CSS2, Änderung in CSS 2.1) voice-familiy (CSS2, Änderung in CSS 2.1) pitch (CSS2, Änderung in CSS 2.1) stress (CSS2, Änderung in CSS 2.1) richness (CSS2, Änderung in CSS 2.1) azimuth (CSS2, Änderung in CSS 2.1) elevation (CSS2, Änderung in CSS 2.1) speak-punktuation (CSS2, Änderung in CSS 2.1) speak-numeral (CSS2, Änderung in CSS 2.1) Inhalt

8 A Die CD-ROM zum Buch 541 B Die Website zum Buch 543 C Die Referenzkarte 545 D Glossar 547 Index 555 Inhalt 11