Direktnavigation

Weitere Infos

Sie lesen:
LB Teil 1 (2009)

Little Boxes Teil 1 (Cover)

Aktuell (2015)
Einstieg in CSS

Einstieg in CSS (Cover)


2. Auflage!

Einstieg in CSS (Cover)

Inhaltsbereich

Ein zweites Stylesheet nur für den Ausdruck

In diesem Abschnitt erstellen Sie ein zweites Stylesheet mit dem passenden Namen druckversion.css und binden es im HTML mit einem zweiten link-Element ein. Durch die Angabe von media="print" wird dieses Stylesheet nur zum Ausdrucken der Seite verwendet.

Erstellen Sie zunächst ein zweites Stylesheet mit dem Namen druckversion.css.

ToDo: Ein zweites Stylesheet für den Ausdruck erstellen
  1. Erzeugen Sie mit einem Editor eine leere Datei.
  2. Fügen Sie am Anfang der Datei folgenden Kommentar ein:

    /* ===================================================
    Stylesheet für die Übungsseiten aus "Little Boxes, Teil 1"
    Stand: Druckversion (Kap. 10)
    Datei: druckversion.css
    Media: print
    Datum: ...
    Autor: ...
    =================================================== */

  3. Speichern Sie die Datei unter dem Namen druckversion.css in Ihrem Übungsordner.

Jetzt müssen Sie im HTML der beiden Beispielseiten noch ein zweites link-Element einbauen.

ToDo: Ein zweites link-Element für den Ausdruck einbinden
  1. Öffnen Sie die Webseiten index.html und kontakt.html in einem Editor und fügen Sie das hervorgehobene link-Element ein:

    <head>
    <!-- Andere HTML-Elemente unverändert lassen -->
    <link href="bildschirm.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="druckversion.css" rel="stylesheet" type="text/css" media="print" />
    </head>

  2. Speichern Sie beide Dateien und schließen Sie sie wieder.

Damit sind die Vorbereitungen fertig, und es kann losgehen.