Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- modul:m287:learningunits:lu02:einfuehrung [2025/02/28 07:24] – kdemirci
+++ modul:m287:learningunits:lu02:einfuehrung [2025/02/28 07:55] (aktuell) – kdemirci
@@ Zeile 1: / Zeile 1: @@
-====== LU01a - Einführung in Cascading Stylesheets (CSS) ======
+====== LU02a - Einführung in Cascading Stylesheets (CSS) ======
 ===== Basistechnologien einer einfachen Webseite =====
@@ Zeile 140: / Zeile 140: @@
 </html>
 </code>
+. **externes Stylesheet (External Style Sheet)**: Sie verwenden eine externe Stylesheet-Datei und verknüpfen diese mit dem HTML-Dokument.
+<code>
+<!DOCTYPE html>
+<html>
+  <head>
+    <link rel="stylesheet" href="style.css">
+  </head>
+  <body>
+    <h1>Dies ist eine Überschrift</h1>
+    <p>Dies ist ein Absatz</p>
+  </body>
+</html>
+</code>
+. **Inline-Style**: Sie notieren die CSS-Stilangaben direkt im HTML-Element.
+<code>
+<h1 style="color:blue;">Dies ist eine Überschrift</h1>
+</code>
+===== Medienspezifische Stylesheets für die Ausgabe =====
+Schon bei CSS Level 2 gab es medienspezifische Stylesheets für bestimmte Ausgabegeräte. Mit dem media-Attribut im link-Element werden die Stylesheets für ein bestimmtes Ausgabemedium festlegt. Dabei wird ein Stylesheet nur auf bestimmte Ausgabenmedien angewendet.
+Dazu werden separate Stylesheets für die unterschiedliche Ausgabemedien, z. B. für den Bildschirm (media="screen") oder für den Drucker (media="print") zur Verfügung gestellt.
+Das Thema Medien-Typen (seit CSS2) wird später im Semester unter dem Thema Responsive Webdesign vertieft.