CSS: Kombination der Einbindung

CSS kann gleichzeitig auf mehrere Arten eingebunden werden: extern, im <head> und inline. Alle Quellen gelten gleichzeitig.

Kaskade: Bei Konflikten gilt — spätere Definitionen überschreiben frühere. Inline-CSS hat dabei die höchste Priorität.

<head>
  <!-- 1. Externe Datei (wird als erstes geladen) -->
  <link rel="stylesheet" href="css/1_02.css">

  <!-- 2. Style im head (überschreibt externe Regeln für p und b) -->
  <style>
    main p { background: #6666dd; color: #fff; }
    b      { background: #f00; }
  </style>
</head>

<!-- 3. Inline-CSS (höchste Priorität, überschreibt alles) -->
<p style="border: 5px dotted #0a4b3e;">...</p>

Im Inhaltsbereich: externe Datei setzt türkisen Hintergrund; <style> im Head überschreibt die Absatz-Farbe zu lila; das Inline-CSS des letzten Absatzes überschreibt noch einmal den Rahmen.

Hallo!

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Zwischenüberschrift

Und weil es so schön ist kommt hier direkt noch mehr Text, sogar mit einem hervorgehobenen Wort.
Dieser Absatz hat zusätzlich noch Inline-CSS: border: 5px dotted #0a4b3e;

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.