Studio Editor: Elemente stapeln (Stacking)
4 Min. Lesezeit
Ein Stapel ist ein Flexbox-Container, der eine Gruppe von Elementen „umschließt“, unabhängig davon, ob sie sich in vertikaler oder horizontaler Reihenfolge befinden. Er stellt sicher, dass die Elemente in dem von dir definierten Abstand in der entsprechenden Reihenfolge bleiben und sich nie überlagern.
Du kannst jedoch negative Ränder verwenden, damit Elemente sich absichtlich überlappen.
In diesem Artikel erfährst du mehr über folgende Themen:
Einen Stapel anwenden
- Klicke auf ein Element, das gestapelt werden soll.
- Halte die Umschalttaste gedrückt und wähle die anderen Stapelelemente aus.
- Klicke auf Stapeln.
- (Optional) Halte die vertikale Linie zwischen den Elementen gedrückt, um die Ränder festzulegen.
Tipp:
Du kannst auch negative Ränder erstellen, damit Elemente sich absichtlich überlappen.
Die Stapelrichtung ändern
Wenn du Elemente stapelst, wird die Richtung automatisch durch die Reihenfolge der Elemente bestimmt. Wenn die Elemente zum Beispiel vertikal angeordnet sind, ist der Stapel vertikal.
So oder so, du kannst die Richtung jederzeit ändern, indem du das Aufklappmenü verwendest. Dadurch werden die Elemente automatisch neu angeordnet, damit sie sich in der richtigen Reihenfolge befinden.
Einen Stapel verwalten
Du kannst den Stapel jederzeit an neue Inhalte und Anforderungen anpassen. Füge weitere Elemente zum Stapel hinzu, verschiebe sie mit einem Klick auf einen Button und trenne Elemente, die nicht mehr relevant sind.
Um einen Stapel zu verwalten:
- Wähle den entsprechenden Stapel aus.
- Wähle aus, was du als nächstes tun möchtest:
Ein Element zum Stapel hinzufügen
Ein Element vom Stapel trennen
. Klicke dann auf Vom Stapel trennen.
Elemente im Stapel neu anordnen
und Nach unten schieben 
.
Stapel von Elementen auflösen
Einen Stapel gestalten
Der Stapel muss nicht transparent sein, du kannst ihn so gestalten, dass der Inhalt auf der Seite hervorsticht. Füge eine Hintergrundfarbe, einen Rand und einen Schatten hinzu. Du kannst auch die Stapelecken runder oder eckiger gestalten.
Um einen Stapel zu gestalten:
- Wähle den entsprechenden Stapel aus.
- Klicke oben rechts im Editor auf den Pfeil Inspektor öffnen
. - Scrolle nach unten zu Design.
- Gestalte den Stapel mit den verfügbaren Optionen:
- Lege die Hintergrundfarbe und die Deckkraft fest.
- Füge einen Rand hinzu, um den Stapel zu umrahmen.
- Wähle einen Radius für die Ecken.
- Aktiviere die Option Schattierung und verwalte Einstellungen wie Winkel, Abstand, Größe usw.
War das hilfreich?
|