Loading...


CSS White Space Generator

Konfiguration

White Space

Klasse

Vorschau

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Code

ReadyTools Academy

Kommt bald

Lerne HTML, CSS und JavaScript kostenlos mit der ReadyTools Academy.

Verfolge deinen Lernfortschritt, wachse in deinem Tempo und habe Spaß dabei! 🎯

CSS White Space Generator

In CSS wird die Eigenschaft white-space verwendet, um zu steuern, wie Leerzeichen (Leerzeichen, Tabulatoren und Zeilenumbrüche) innerhalb eines HTML-Elements behandelt werden. Sie ermöglicht es Ihnen, zu steuern, wie Textinhalte umbrochen, abgeschnitten oder in Bezug auf Leerzeichen und Zeilenumbrüche angezeigt werden.

Die Eigenschaft white-space kann die folgenden Werte annehmen:

normal: Text wird mit der Standard-Leerzeichenbehandlung angezeigt, und alle Folgen von aufeinanderfolgenden Leerzeichen werden zu einem einzigen Leerzeichen zusammengefasst.

.normal-spacing { white-space: normal; }

nowrap: Text wird nicht in die nächste Zeile umbrochen, und lange Zeilen laufen über den Container hinaus oder werden abgeschnitten.

.no-wrap-text { white-space: nowrap; }

pre: Text wird genau so angezeigt, wie er im HTML-Quellcode steht, wobei Leerzeichen, Zeilenumbrüche und mehrere Leerzeichen erhalten bleiben.

.preformatted-text { white-space: pre; }

pre-line: Text wird mit normaler Leerzeichenbehandlung angezeigt, aber Zeilenumbrüche bleiben erhalten.

.pre-line-text { white-space: pre-line; }

pre-wrap: Text wird sowohl mit Leerzeichen als auch mit Zeilenumbrüchen angezeigt.

.pre-wrap-text { white-space: pre-wrap; }

Die Eigenschaft white-space wird häufig verwendet, um Text innerhalb von HTML-Elementen zu formatieren, insbesondere um Code, vorformatierte Texte oder andere Inhalte anzuzeigen, die eine bestimmte Leerzeichenbehandlung erfordern. Sie ist ein nützliches Werkzeug, um sicherzustellen, dass Text so dargestellt wird, dass er am besten zum gewünschten Layout und Design einer Webseite passt.


Top-Werkzeuge

CodeHubBoardly NEULinksy NEUChromo NEU

Sprache wählen

Thema wählen

© 2025 ReadyTools. Alle Rechte vorbehalten.