nach Pseudo-Element: Können Sie Zeilenumbrüche das hinzufügen?

Question

Ich möchte ein <br /> zu einer bestimmten Klasse anhängen. die Verwendung von:. nach Pseudo-Klasse zeigt einfach <br /> als Text

Gibt es eine Möglichkeit, diese Arbeit zu machen?

Es ist intern für IE8 so Browser-Probleme sind kein Problem. Wenn ich das tue

<span class="linebreakclass">cats are</span> brilliant

I "brilliant" will auf eine neue Zeile angezeigt wird.

Answer 1

Sie werden nicht in der Lage sein, HTML-Tags zu machen, aber Sie können Stil wie folgt festgelegt:

.needs-space:after
{
    content: " ";
    display: block;
    clear: both; /* if you need to break floating elements */
}

Die wichtigste Einstellung hier display: block; Dieser rendert : Nach Inhalt in einem DIV. Und dieses Pseudo-Element wird von allen aktuellen Browsern unterstützt. Einschließlich IE. Mit diesen Worten sollten Sie Ihre Benutzer und deren Browser bewusst sein.

Answer 2

Sie können \A Escape-Sequenz verwenden, die als Newline machen werden:

.new-line:after {
  white-space: pre-wrap;
  content: "\A";
}

Diese Methode wurde in der CCS 2.1 Spezifikation für die content Eigenschaft genannt:

  

Autoren können neue Zeilen in den generierten Inhalten umfassen durch das Schreiben   "\A" Escape-Sequenz in einen der Saiten nach dem 'content'   Eigentum. Dieser eingefügte Zeilenumbruch ist noch unter dem Vorbehalt der    'white-space' Eigenschaft.

Answer 3

Es wird noch schlimmer - das. Nach dem Unterricht auch in IE6 nicht funktioniert (und wahrscheinlich auch einige andere Browser auch)

Ich denke, was Sie wirklich wollen hier ein Spielraum auf der Unterseite des Elements ist, Abstand zu schaffen.

Einfach

.myElement {
    margin-bottom: 1em;
}