# Mobiles / Responsives Design

## 📱 Mobile Geräte / Responsive Design

Alle Umfrage- und Formularstile werden standardmäßig mit Unterstützung für Mobil-, Tablet- oder Desktop-Clients geliefert. Der Stil passt sich automatisch an das Zielgerät an; einige Fragen wie die [Matrixfragen](https://docs.ngsurvey.com/de/form-management/form-designer/questions/question-types/matrix-questions) passen sogar ihre Darstellung an die Einschränkungen mobiler Geräte an. 

Der Stil-Editor ermöglicht es Ihnen jederzeit eine Vorschau anzusehen, wie Ihre Umfrage auf dem von Ihnen gewählten Zielgerät aussehen wird.

![](https://133942686-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBbtfqVdgt-ErIp2i94%2F-MBbz7P4lfVJz7CusAMq%2Fimage.png?alt=media\&token=1ad8481f-11ed-445c-bb09-28a5bbf67d78)

{% hint style="warning" %}
Seien Sie vorsichtig, wenn Sie ein Zielgerät auswählen und die [Elements](https://docs.ngsurvey.com/de/form-management/style-branding/style-editor/elements) Eigenschaften bearbeiten, da die [Elements](https://docs.ngsurvey.com/de/form-management/style-branding/style-editor/elements) Eigenschaften, wie unten beschrieben, pro Zielgerät gespeichert werden. Wenn Sie möchten, dass Ihre Änderungen alle Geräte betreffen, stellen Sie sicher, dass Sie zurück zu **Alle Geräte** wechseln, bevor Sie Änderungen an den Elementen vornehmen
{% endhint %}

##  💻 Unterschiedliche Stile für verschiedene Geräte.

Der Standardmodus beim Bearbeiten eines Stils ist, dass der Stil alle Geräte anspricht. Wenn Sie beispielsweise die Schriftgrößen der Antworten in den [Elements](https://docs.ngsurvey.com/de/form-management/style-branding/style-editor/elements) Eigenschaften ändern, haben alle Geräte dieselbe Schriftgröße. 

Sie können jedoch auch einen granuläreren Ansatz verfolgen und für jedes Zielgerät einen eigenen Stil erstellen. 

Wenn Sie unterschiedliche Stileigenschaften basierend auf dem Zielgerät festlegen möchten, wählen Sie das Zielgerät aus, für das Sie die Eigenschaften bearbeiten möchten, und bearbeiten Sie die [Elements](https://docs.ngsurvey.com/de/form-management/style-branding/style-editor/elements) Eigenschaften. 

![](https://133942686-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBbtfqVdgt-ErIp2i94%2F-MBbwPLP8Qs9nQB0JIbn%2Fimage.png?alt=media\&token=bff1c160-0d7c-48a1-9c04-50449cd9b38d)

Wenn Sie das Smartphone-Ziel gesetzt haben, werden Änderungen an den [Elements](https://docs.ngsurvey.com/de/form-management/style-branding/style-editor/elements) nun nur auf Smartphones angezeigt. 

Stil-Eigenschaften werden zur Laufzeit in der Umfrage basierend auf der Browser-Breite des Befragten gesetzt. Läuft der Nutzer beispielsweise auf einem Laptop mit einer Bildschirmauflösung von 960px, versucht ngSurvey zunächst, die für das **Laptop** Zielgerät gesetzten Stileigenschaften zu verwenden; wenn dort keine Eigenschaften gefunden werden, fällt es zurück auf das **Tablet** und so weiter. Wenn ngSurvey keine zielgerätespezifischen Eigenschaften findet, fällt es auf das **Alle Geräte** Eigenschaften. 

{% hint style="warning" %}
Zur spezifischen Zielgerät-Stilen haben Vorrang vor dem globalen Alle Geräte-Zielstil und überschreiben jede ähnliche Eigenschaft.
{% endhint %}