Link Search Menu Expand Document

Grafik-Element

Zum Einfügen einer Grafik in die Fernbedienungsseite, ziehen Sie das Grafik-Symbol auf die Oberfläche.

Grafik Status zuweisen

Für die selektierte Grafik kann im Eigenschaften-Menü auf der rechten Seite eine Grafik aus den Grafiken des Bilderkataloges wählen oder eigene Grafiken importieren. Über die im Eigenschaften-Menü angebotenen Einstelloptionen kann die Grafik konfiguriert werden. Mit dem „Anker“-Symbol können Sie die Grafik fixieren. Sollten sich mehrere Elemente überlagern, können sie über die Ebenenoptionen schrittweise oder komplett in den Vorder- oder Hintergrund verschoben werden.

Grundsätzlich können Grafik-Elemente einerseits als rein statische „Design-Objekte“ ohne Funktion in der Oberfläche verwendet werden. Alternativ bieten Grafik-Elemente auch die Möglichkeit, den Status von Geräten anzuzeigen.

Grafik-Element mit CSS gestalten

Verfügbar ab Version 3.0.1

Über die Funktion „Gestaltung/ CSS“ kann man das Design des Grafik-Elementes auch mittels CSS-Befehlen definieren. Dabei wirken sich die CSS-Befehle auf das ganze Grafik-Element aus. D.h. Wenn bei Icon noch ein Bild ausgewählt ist, werden CSS Gestaltungsbefehle (wie z.B. Filter oder Opacity) auch darauf angewendet.

Bitte beachten: Es lassen sich mit dieser Funktion dem Element CSS-Eigenschaften zuweisen. Mit CSS-Selektoren wie „:hover“ oder CSS-Klassen kann dabei nicht gearbeitet werden.

Grundsätzlich ist die CSS-Option vor allem für die Gestaltung von flächigen Gestaltungen oder auch für Umrahmungen relevant. In diesem Fall ist es meistens sinnvoll, nur CSS und kein Icon-Bild zu verwenden (kann über den „X“-Button bei Icon entfernt werden).

Grafik Status zuweisen

Wichtiger Hinweis: Die meisten CSS-Befehle können nicht direkt auf der Fernbedienungsseite angezeigt werden, sondern erst in der Vorschau. Zur Überprüfung der Gestaltung nutzen Sie deshalb bitte die Vorschau.

Eigene CSS-Gestaltungen als Vorlagen speichern

Über den Button „Speichern“ kann man die CSS-Gestaltung als eigene Vorlage speichern, die anschließend im Dropdownmenü auswählbar ist. Die ausgewählte Vorlage kann über die „Löschen“-Taste wieder aus der Liste entfernt werden.

Tipp: Wer keine Erfahrungen mit CSS hat, kann sich die Befehle relativ einfach auch über viele im Web verfügbare CSS Editoren erzeugen und in NEO kopieren.


Copyright © 2022 mediola – connected living AG
Impressum