Eigene CSS-Klassen für die mobile Darstellung definieren

Dieser Abschnitt richtet sich an Anwender, die über tiefergehende Kenntnisse im Bereich CSS (Cascading Style Sheets) verfügen. (Vergleichen Sie hierzu beispielsweise die Webseite von w3schools.com.)

Das Advanced Template bietet die Möglichkeit, eigene CSS-Klassen für die mobile Darstellung zu definieren. D.h. Sie können an manchen Stellen manuell in das standardmäßig implementierte, mobile Verhalten des Advanced Template eingreifen.

Hinweis: Beachten Sie, dass das Verwenden eigener CSS-Klassen auf eigene Verantwortung erfolgt. Nicht alle E-Mail-Clients können CSS-Klassen korrekt interpretieren. Darin unterscheiden sie sich von Browsern. Aus diesem Grund kann Inxmail beim Einsatz eigener CSS-Klassen keine Verantwortung für gegebenenfalls auftretende Darstellungsprobleme übernehmen.

Sie können eigene CSS-Klassen u.a. für die mobile Darstellung von Bildern verwenden.

Beispiel

In der mobilen Darstellung sollen einige Bilder nur 75 Prozent der Displaybreite einnehmen.

Ohne eigene CSS-Klasse

CSS-Klasse "width:75%"

Schritt für Schritt

Um eine eigene mobile CSS-Klasse anzulegen, gehen Sie wie folgt vor:

  1. Klicken Sie auf das Hauptelement Einstellungen.

  2. Klicken Sie auf (Element hinzufügen).

    Ein Dialogfenster wird angezeigt.

  3. Wählen Sie das Element Erweiterung mobiler CSS-Klassen aus.

  4. Bestätigen Sie das Dialogfenster mit Hinzufügen + Schließen.

    Das Element Erweiterung mobiler CSS-Klassen wird angezeigt.

  5. Erfassen Sie im Eingabefeld die mobile CSS-Klasse.

    Die Syntax muss folgendem Schema folgen: .klassenName{Eigenschaft:Wert; Eigenschaft2:Wert;}.

  6. Speichern Sie Ihre Angaben.

  • Sie haben eine eigene mobile CSS-Klasse angelegt.

Schritt für Schritt

Um eine eigene mobile CSS-Klasse auf ein Bild anzuwenden, gehen Sie wie folgt vor:

  1. Klicken Sie auf die Schaltfläche Bild verlinken für das Bild, dem Sie ein mobile CSS-Klasse zuweisen möchten.

  2. Das Dialogfenster Bild verlinken wird angezeigt.

  3. Klicken Sie auf Optionen.

    Das Dialogfenster Optionen wird angezeigt.

  4. Erfassen Sie unter Optionale HTML-Parameter die mobile CSS-Klasse.

  5. Bestätigen Sie das Dialogfenster mit OK.

  6. Speichern Sie Ihre Angaben.

  • Sie haben eine eigene mobile CSS-Klasse auf ein Bild angewendet.

Verwandte Themen