Hauptmenü

Untermenü

Advanced CSS - Einführung

1. Vorwort

Wer von euch bis dato glaubte, alles über CSS zu wissen, den muss ich hier leider eines Besseren belehren. Selbst ich habe in den letzten ein bis zwei Jahren feststellen müssen, dass ich einige Dinge immer noch nicht kannte. Darum werde ich euch hier mit den Feinheiten vertraut machen, die obendrein wirklich sehr, sehr wichtig sind. Außerdem bekommt ihr ein paar Tipps von mir, was man auf gar keinen Fall machen sollte, was überflüssig ist und was Probleme bereiten kann. In den bald folgenden Tutorials werde ich dann anhand einiger Beispiele darauf eingehen.

2. An die Anfänger

Das was jetzt kommen wird, ist etwas härterer Stoff. Also wenn ihr mit CSS gerade erst anfangt, so führt euch doch bitte erst mal die grundlegende Theorie zu Gemüte, bevor ihr euch hier verzettelt. Denn eines sei euch gesagt, hier geht es ums Eingemachte und ohne die entsprechenden Vorkenntnisse seid ihr genau so hilflos wie ein Deutscher in Paris ohne Französisch-Kenntnisse.

3. Übersicht

Kontext-Selektoren

Da ich vor längerer Zeit beschlossen habe, mich nicht mehr um den Internet Explorer 6/7 zu kümmern, zeige ich euch hier ein paar Selektoren, die euch viele Möglichkeiten bei der Gestaltung von HTML-Elementen bieten.

Pseudoklassen und Pseudoelemente

Bei den Elementen bin ich nur auf die Dinge eingegangen, die bei Links funktionieren. Hier beschäftigen wir uns mal intensiver mit dem Thema, weil damit sehr interessante Formatierungen möglich sind.

Serverseitige Schriften

Eine interessante Methode, um Schriften eigener Wahl in Internetauftritten einzubinden, zeige ich euch hier. Funktioniert allerdings nur mit verschiedenen Schrifttypen und ist in vielen älteren Browsern nicht verfügbar.

Echte Kaskadierung

Bei der Einführung zur Kaskadierung habe ich bewusst darauf verzichtet, euch das tatsächliche Konzept zu erläutern. Das werde ich hier nachholen und euch auch gleichzeitig mit Dingen vertraut machen, die ich bisher ignoriert habe. Und diesen Abschnitt solltet ihr unbedingt lesen, bevor ihr euch das Thema "Spezifität" stürzt!

Spezifität

Beim Thema Gewichtung habe ich schon ein paar Regeln aufgestellt, wann welche CSS-Anweisung höher bewertet wird. Hier erfahrt ihr nun, nach welchen Kriterien dies geschieht. Allerdings solltet ihr zumindest die elementaren Grundrechenarten beherrschen, da hier ein klein wenig Mathematik (und auch Logik) im Spiel ist.

Grenzen der Vererbung

Zu diesem Bereich gab es bisher nur den Hinweis, dass nicht alle CSS-Deklarationen weiter vererbt werden. Hier erfahrt ihr nun, um welche es sich handelt. Und seid gewiss, es sind Einige.

Collapsing margins

Hier werdet ihr neben dem idiotischen Box-Modell ein weiteres Beispiel für eine völlig sinnlose Spezifikationen kennen lernen. Denn hier wird aus zwei vertikalen margin-Angaben nur noch eine.

Pro und Contra

Diesen Abschnitt habe ich aufgebaut, weil ich im letzten Jahr einige Mails bekam, wo man mich darum bat, mal etwas zum optimalen Einsatz von CSS zu sagen. Ich habe also versucht, das Für und Wider möglicher Varianten zu analysieren, um euch ein paar Tipps zu geben.

4. Ein Hinweis

Ich lege euch besonders die Abschnitte Spezifität sowie Pro und Contra wärmstens ans Herz. Hier werde ich wichtige Grundsätze von CSS ansprechen, die ich bei der Einführung für Anfänger bisher tunlichst umgangen habe. Wegen der Didaktik ;-).

weiter zum nächsten Abschnitt