CSS wurde entworfen, um Darstellungsvorgaben weitgehend von den Inhalten zu trennen. Elemente eines Dokumentes können mit sogenannten CSS-Selektoren aufgrund verschiedener Eigenschaften identifiziert werden, z.B. über ihre Klasse, ihren Attributen oder ihrer Position im Dokument. Mittels CSS-Eigenschaften wird dann die Darstellung dieser Elemente geändert, z.B. andere Schriftart, Farbe etc.

Im CSS-Bereich kann eigenes CSS geschrieben werden, um die visuelle Darstellung des Formulars zu ändern.

Eine Liste von spezischen Selektoren innerhalb von Xima® Formcycle findet sich im Bereich Elementselektoren.

Hilfeseiten und Tutorials zu jQuery

CSS-Selektoren

CSS-Anweisungen

Beispiele

Hier werden Standardwerte für das Formular gesetzt. In dem für das Formular eine Schriftgröße in Pixel gesetzt wird, können für alle anderen Elemente die CSS-Einheiten em bzw. rem verwendet werden. Wird später die Schriftgröße des Formulars geändert, ändern sich alle anderen Schriftgrößen proportional.

FORM.xm-form { /* Selektiert das gesamte Formular
    font-size: 16px; /* Setzt die Basisschriftgröße. */

   color: #111; /* Setzt die Default-Schriftfarbe. */
   font-family: Arial; /* Setzt die Default-Schriftart. */
}

Hiermit werden alle Texten mit der Klasse hoherText groß dargestellt. Die Klasse kann im Xima® Formcycle-Designer rechts unter CSS Klassen Elementen gegeben werden.

.hoherText .XTextField { /* Selektiert alle Texte mit der Klasse hoherText
    height: 60px; /* Setzt die Höhe des Feldes auf 60 Pixel */

   font-size: 40px; /* Setzt die Schriftgröße auf 40 Pixel. */
   font-weight: bold; /* Macht den Text fett. */
   text-align: center; /* Richtet den Text mittig aus. */
}
Tags:
Copyright 2000-2024