Glossar: Quirks Mode

Glossar: Quirks Mode

Definition

Der Begriff "Quirks Mode" steht für quirk (Eigenart, Macke).

Der "Quirks Mode" ist ein Kompatibilitätsmodus moderner Browser, der HTML-Seiten so rendert, wie es alte Browser (vor allem Netscape 4 und Internet Explorer 5) getan hätten. Browser erkennen anhand der DOCTYPE-Deklaration, ob sie im Quirks Mode oder Standards Mode arbeiten. In den 1990er Jahren gab es keine einheitlichen Webstandards. Alte Webseiten verwendeten viele Hacks, um Layouts in Netscape und IE korrekt darzustellen. Spätere Browser mussten Kompatibilität zu diesen Seiten sicherstellen. Dieser "Kompromis" ist der "Quirks Mode".

Beispiele

= Tag

= Attribut

= Wert

Text

= Kommentar bzw. wichtig!

Beispiel Quirks Mode

Der Code:

<!-- KEIN DOCTYPE HIER -->
<html>
<head>
  <style>
    .demo-box {
      width: 300px;
      height: 100px;
      background: #ff4757;
      border: 20px solid #2f3542;
      padding: 50px;
      /* Dieser Wert macht den Unterschied! */
      color: white;
      font-family: sans-serif;
      font-weight: bold;
    }
  </style>
</head>
<body>
  <div class="demo-box">
    Ich bin im Quirks Mode viel kleiner!
  </div>
</body>
</html>

Ergebnis:

Ergebnis: <quirks>-Demo 1

Beispiel Quirks Mode

Der Code:

Selber Code wie im Beispiel 1, aber nun mit <!DOCTYPE html>

Ergebnis:

Ergebnis: <quirks>-Demo 2

Anmerkungen

Auffallend falsch sind Box-Berechnungen in ihren Ausmaßen wenn auch noch padding dabei ist.
Mit dem Button "Modus prüfen" könnt ihr im "Demofenster" sehen, dass der "Quirks Mode"-Modus aktiv ist, hier im "Hauptfenster" jedoch der Standard-Modus aktiv ist.