Schulung Neuheiten in CSS 3 (Das ist neu Cascading Style Sheets in Version 3)

Beschreibung/Inhalt

Dieses ist auf Aufmodul für CSS-Entwickler. Wenn Sie CSS-Grundlagenwissen benötigen, schauen Sie bitte auf unser Modul #6310 CSS-Basiswissen#.

Optional: CSS-Grundlagen aus früheren Versionen, sofern diese nicht vorhanden sind.

Entwicklung von CSS 2 nach CSS 3

  • Schwächen von CSS 2
  • Konzept der CSS 3-Module
  • Fortschritt der Standards: Candidate/Proposed Recommendation, Working Draft
  • Wiederholung CSS-Selektoren
  • Gruppieren von Selektoren
  • Kombinatoren: Nachfahr-/Kindkombinator, direkter/indirekter Nachbarkombinator
  • Namensräume (CSS Namespaces)
  • Zusammenspiel HTML 5 und CSS 3
  • Aktuelle Browser-Unterstützung


  • Hintergründe und Rahmen
  • Wiederholung vom Box-Modell
  • Mehrere Hintergrundbilder
  • Beschnitt von Hintergrundbildern
  • Überblick über alle background-Properties
  • Rahmentypen, Breiten, Rundungen
  • Rahmen mit Grafiken
  • Umbruch von Boxen steuern mit box-decoration-break


  • CSS Text (Texteffekte)
  • Verarbeitung von Leerraum in HTML
  • Wie Leerraum zusammengeführt wird: white-space-collapse
  • Zeilenumbruch mit word-break steuern
  • Textumbruch mit text-wrap steuern
  • Blocksatzsteuerung über text-align, Textzentrierung und text-justify
  • text-indent: Einrücken der ersten Zeile steuern
  • text-align-last: Zeilenausrichtung für letzte Zeile steuern
  • word-spacing für Wortabstände nutzen
  • Wie sieht minimaler/maximaler/optimaler Leerraum aus?
  • letter-spacing für Zeichenabstände
  • Steuerung zur Zusammenfassung von Punktionszeichen
  • punctuation-trim für mathematische Formeln verwenden
  • Kleine Symbole über text-emphasis setzen
  • Photoshop-ähnliche Schattierungen mit text-shadow


  • Selektoren
  • Universal-Selektor
  • Typ-Selektor
  • Klassen- und ID-Selektor
  • Erweiterungen beim Attribut-Selektor, Teilzeichenketten erkennen
  • Namensräume bei CSS 3-Selektoren


  • Pseudo-Klassen
  • Aufgaben von Pseudo-Klassen
  • Dynamische und strukturelle Pseudo-Klassen
  • Elemente mit :lang aufgrund der Sprache auswählen
  • URI-Ziele mit :target auswählen
  • Ein- und Ausblenden von Inhalten mit Hilfe von :target
  • Dynamische Pseudo-Klassen :link und :visited
  • :hover, :active und :focus für Links
  • :enabled, :disabled, :checked, :indeterminate als Kriterium für Gui-Zustände
  • :root für HTML-Wurzelelement
  • Elemente ohne Kinder mit :empty selektieren
  • Kindselektion mit :first-child, :last-child, :nth-child(), …
  • Abwechselnd farbige Tabellenzeilen
  • Selektion von Typen mit :first-of-type, :last-of-type, :nth-of-type(), …
  • Logische Verneinung mit not


  • Pseudo-Elemente
  • Unterschied Pseudo-Klassen und Pseudo-Elemente
  • Elemente vor/hinter einem Element über before/after
  • Erste Zeile über ::first-line
  • CSS-Formatierungsmöglichkeiten
  • Initialen mit ::first-letter


  • Spalten-Modul
  • Box-Modell und Spalten-Modell
  • Anzahl von Spalten steuern
  • Breite und Abstände von Spalten
  • Spaltenfarbe und -stil
  • Spaltenumbruch
  • Spaltenausgleich
  • Elemente, die über mehrere Spalten laufen
  • Überlauf durch zu große Elemente steuern


  • Vorstellung weiterer CSS 3-Module
  • CSS3-Values and Units, calc()-Funktion
  • CSS Ruby-Modul für Betonungen oder Zusatzerklärungen
  • Webtypografie mit CSS Fonts (WebFonts), Fonts laden
  • Paginierte Ausgaben, @page-Regel, Boxen, Seitenumbrüche
  • CSS für 2D- und 3D-Transformationen

  • Dauer
    Auf Wunsch. Gerne geben wir Ihnen eine Empfehlung zur notwendigen Schulungsdauer, wenn Sie uns in der Anfrage Ihre Vorkenntnisse und Ziele nennen.
    Ort
    Online oder in Deutschland, Österreich und der Schweiz an Ihrem Firmensitz
    Schulungsdidaktik
    Nach Ihrer Wahl: Klassische Schulung mit PC-Übungen, reine Präsentation ohne PC-Übungen oder interaktiver Workshop mit Beratungsanteil