# AX - Trennlinie

## Übersicht

**AX - Trenner** ist eine Experience Cloud-Komponente, die visuelle Trennlinien zwischen Inhaltsbereichen auf Seiten von Experience Sites erstellt.

Verwenden Sie sie, um horizontale Linien, Abstände oder visuelle Unterbrechungen zwischen Komponenten hinzuzufügen, um die Seitenorganisation und Lesbarkeit zu verbessern. Konfigurieren Sie Stil, Farbe, Dicke und Abstand des Trenners im Experience Builder.

Perfekt zum Trennen von Formularabschnitten, Abgrenzen von Inhaltsblöcken, Organisieren langer Seiten oder überall dort, wo Ihr Portal eine klare visuelle Trennung zwischen unterschiedlichen Inhaltsbereichen benötigt. 

## Einstellungen

{% tabs %}
{% tab title="🎛️ Eigenschaften" %}

| Name                              | Beschreibung                                                                                                                                                                   | Verwendung                                                                                                                                                             |
| --------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Titel**                         | Der Text wird neben dem Trenner angezeigt, um Kontext oder zusätzliche Informationen zu liefern.                                                                               | Implementieren Sie diese Eigenschaft, um die Abschnitte zu beschriften, die der Trenner trennt, und so das Verständnis der Benutzer zu verbessern.                     |
| <h4>Icon-Name und Icon-Größe</h4> | Integrieren Sie ein Icon, das zusammen mit dem Trenner zusätzliche visuelle Hinweise bietet. Die Größe des Icons kann ebenfalls angepasst werden, um zur Gestaltung zu passen. | Verwenden Sie Icons als visuelle Hinweise, die den Titel ergänzen oder auf den folgenden Inhalt hinweisen und so die kommunikative Funktion des Trenners unterstützen. |
| **Inhalt ausrichten**             | Bestimmen Sie die Platzierung von Titel und Icon in Bezug auf die Trennlinie. Optionen umfassen **`Anfang`**, **`Ende`**, oder **`Mitte`**`.`                                  | Richten Sie den Inhalt basierend auf dem Layout und der erforderlichen Betonung aus, damit sich der Trenner nahtlos in den Seitenfluss einfügt.                        |
| **Ausrichtung**                   | Legen Sie die Ausrichtung des Trenners fest auf **`Horizontal`** oder **`Vertikal`**, und bieten Sie so Flexibilität bei der Art und Weise, wie Inhalte getrennt werden.       | Wählen Sie die geeignete Ausrichtung, die am besten zum Layout Ihrer Inhalte passt, sei es ein Seitenvergleich oder eine Aufteilung oben und unten.                    |
| {% endtab %}                      |                                                                                                                                                                                |                                                                                                                                                                        |

{% tab title="🎨 Styling" %}

| Name       | Beschreibung                                                                                                                                              | Verwendung                                                                                                                                                                                     |
| ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Titel**  | Passen Sie das Erscheinungsbild des Titels mit Optionen für Farbe, Schriftgröße, Stil und Gewicht an.                                                     | Gestalten Sie den Titel so, dass er angemessen hervortritt und die Konsistenz mit dem allgemeinen Designschema der Site beibehält.                                                             |
| **Icon**   | Gestalten Sie das Icon mit Hintergrundfarbe, Vordergrundfarbe, einem Standardzustand für die Vordergrundfarbe und dem Icon-Radius für abgerundete Kanten. | Feinabstimmen Sie das Erscheinungsbild des Icons, um es prominenter oder dezenter zu machen und es an die Designziele anzupassen.                                                              |
| **Rahmen** | Definieren Sie den Rahmen des Trenners, indem Sie Größe, Farbe und Stil (durchgehend, gestrichelt, gepunktet und mehr) festlegen.                         | Passen Sie die Rahmen-Einstellungen an, um das gewünschte Maß an Unterscheidung zwischen Inhaltsabschnitten zu erzeugen, von einer deutlich sichtbaren Linie bis zu einer subtileren Trennung. |

{% endtab %}
{% endtabs %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-de/experience-components/ax-trennlinie.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.