Verfügbare CSS-Klassen
CSS-Klassen für Content-Elemente
vertical-align-center
Zentriert ein einzelnes Content-Element vertikal innerhalb der Spalte eines Spaltensets
Voraussetzung: Das umgebende Spaltenset muss den Spaltenset Typ 50x50 equalize verwenden und die Option gleiche Spaltenhöhe aktiviert haben.
first-col-empty
Sollte bei Spaltensets verwendet werden, deren erste Spalte bewusst leer bleiben soll, um einen ungewollten vertikalen Abstand in der einspaltigen Darstellung zu vermeiden.
horizontal-padding
Fügt einen Innenabstand von 20% auf beiden Seiten eines Content-Elements ein.
Responsives Verhalten: Unterhalb des Breakpoints medium wird der Innenabstand entfernt.
padding-right-medium
Fügt einen Innenabstand auf der rechten Seite eines Content-Elements ein, um die Laufweite von Texten zu begrenzen.
Der Innenabstand beträgt maximal 180px und skaliert proportional zur Breite des Viewports.
Responsives Verhalten: Unterhalb des Breakpoints medium wird der Innenabstand entfernt.
CSS-Klassen für Artikel
min-height-400, min-height-500, min-height-600, min-height-content-header
Definiert die Mindesthöhe eines Contao-Artikels. Dies ist insbesondere bei der Verwendung von Hintergrundbildern relevant.
Responsives Verhalten: Unterhalb des Breakpoints medium wird die nur noch durch den Content bestimmt.
slider, slider_adapt, slider_blue, slider_black, slider_grey
- Die Verwendung der Klasse slider aktiviert die Blätterfunktionalität innerhalb eines Artikels. Der Slider hat eine fest Höhe, die sich aus der maximalen Höhe der einzelnen Slides ergibt. Die Farbe der Navigationselemente (Blätterpfeile, Punkte) ist weiss.
- Das Hinzufügen der Klasse slider_adapt führt zu einer variablen Höhe des Sliders, die sich je nach Höhe der einzelnen Slides dynamisch anpasst.
- Durch Hinzufügen der Klassen slider_blue, slider_grey oder slider_black wird die Farbe der Navigationselemente entsprechend geändert.
Beschreibung der Contao-Artikel für die Seite 'Module 50:50'
Hintergrundbild (Text auf Transparent) [ID: 20]
Ausrichtung: mittig/mittig. Das Bild richtet sich im responsiven Verhalten immer mittig aus.
vertikaler Innenabstand: Oben und unten. Stellt einen Abstand zwischen transparenter Hinterlegung und Hintergrundbild dar.
Artikel-CSS-Klasse: Min-height-400. Die Mindesthöhe des Hintergrundbildes beträgt 400px.
Spaltenset-Typ: 50:50 equalize. Bei einer mittigen Ausrichtung des Textelementes muss dieser Typ gewählt werden.
Spaltenset-CSS-Klasse (Inhalt des zweiten Spaltenelements): vertical-align-center. Die transparente Hinterlegung inkl. Text wird vertikal mittig ausgerichtet.
Diesem Spaltenset können weitere Elemente hinzugefügt werden, wie Bullets oder Links. Die Deckkraft der transparenten Hinterlegung und die Textfarbe können benutzerdefiniert bestimmt werden.
Hintergrundbild (Standard) [ID: 15]
Spaltenset-Typ: 50:50
Diesem Spaltenset können weitere Elemente hinzugefügt werden, wie Bullets oder Links. Bullets und Links können in Farbigkeit und Darstellung angepasst werden.
Hintergrundfarbe (Bild/Text) [ID: 13]
Spaltenset-Typ: 50:50
Spaltenset-Typ Buttons: 50x50 buttons
CSS-Klasse: Das Hyperlink-Element des ersten Spaltensets erhält die CSS-Klasse "align-right", um das Element rechts auszurichten.
Hintergrundbild (Text auf Transparent/Bild) [ID: 12]
Ausrichtung: oben/links. Das Bild richtet sich im responsiven Verhalten immer oben links aus.
vertikaler Innenabstand: Oben und unten. Stellt einen Abstand zwischen transparenter Hinterlegung und Hintergrundbild dar.
Spaltenset-Typ: 50:50 equalize. Bei einer mittigen Ausrichtung des Textelementes muss dieser Typ gewählt werden.
Gleiche Spaltenhöhe: Diese Option setzt alle Spalten auf die Höhe der längsten Spalte.
CSS-Klasse: Das Element des zweiten Spalteninhalts erhält die Klasse "vertical-align-center". Das Element wird vertikal zentriert.
Hintergrundfarbe (Text/Bild) [ID: 14]
Spaltenset-Typ: 50:50 equalize. Bei einer mittigen Ausrichtung des Textelementes muss dieser Typ gewählt werden.
Hintergrundfarbe (Bild/Bullets) [ID: 21]
Spaltenset-Typ: 50:50
Aufzählungen:
- Bullets Standard: Elementyp: Text. Subtype: Standard.
- Bullets/Nummerierung groß: Elementyp: Aufzählung. Subtype: Spezial.
- Nummerierung Standard: Elementtyp: Aufzählung. Subtype: Standard.
Farbe und Form der Aufzählung /Nummerierung ist wählbar (Grundfarben + 2 Bulletvarianten).
Hintergrundfarbe (Video/Bullets) [ID: 44]
Spaltenset-Typ: 50:50
Das Video wird mittels html-Code eingebettet.
Digitalisiert verpacken
Verpacken Sie effizienter und schneller in der Industrie 4.0-Technologie mit der Tiefziehgeneration X-line von Multivac. Registrieren Sie sich jetzt für Live-Maschinenpräsentation!