Heim >Web-Frontend >CSS-Tutorial >Wie kann CSS Zeilenumbrüche vor Elementen einfügen?

Wie kann CSS Zeilenumbrüche vor Elementen einfügen?

DDD
DDDOriginal
2024-11-28 20:23:12935Durchsuche

How Can CSS Insert Line Breaks Before Elements?

Kann CSS Zeilenumbrüche vor Elementen einfügen?

Das Einfügen eines Zeilenumbruchs vor einem Element mithilfe der CSS-Inhaltseigenschaft scheint eine unmögliche Aufgabe zu sein. Versuch, „
“ zu verwenden innerhalb der Content-Eigenschaft führt, wie unten zu sehen ist, nicht zum gewünschten Ergebnis:

#restart:before { content: '<br/>'; }

Es gibt jedoch eine Methode, dies zu erreichen, indem die spezielle Escape-Sequenz A im generierten Inhalt des Pseudoelements verwendet wird.

#restart:before { content: '\A'; }

Um eine ordnungsgemäße Formatierung sicherzustellen, kann es erforderlich sein, die zusätzliche CSS-Regel einzuschließen:

#restart { white-space: pre; }

Die A-Escape-Sequenz zeigt das Ende von a an Zeile, wodurch effektiv ein Zeilenumbruch vor dem Zielelement #restart angezeigt wird.

Alternativ besteht ein anderer Ansatz darin, ein Leerzeichen als Inhalt hinzuzufügen und seine Anzeige auf „Blockieren“ einzustellen:

:before { content: ' '; display: block; }

Dadurch wird ein Leerzeichen erstellt, das in einer separaten Zeile erscheint und als Zeilenumbruch fungiert.

Das obige ist der detaillierte Inhalt vonWie kann CSS Zeilenumbrüche vor Elementen einfügen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn