Wie kann ich Text ohne Tags in HTML ausblenden, indem ich nur CSS verwende?

Text ohne HTML-Tags in HTML ausblenden

Problem:

Sie haben HTML-Code mit Text, der keine umgebenden HTML-Tags enthält. Insbesondere möchten Sie den Text „Enter“ ausblenden, der sich unmittelbar nach einem „p“-Tag befindet. Es ist jedoch nicht möglich, den Text mit einem HTML-Element zu umschließen.

Lösung: CSS-Schriftgrößen-Trick

Um Ihr Ziel zu erreichen, können Sie einen CSS-Hack anwenden Nutzung der Eigenschaft „font-size“:

1. Erstellen Sie eine Klasse, z. „.entry“ und weisen Sie ihm eine Schriftgröße von 0 zu:

.entry {
  font-size: 0;
}

2. Fügen Sie innerhalb dieser Klasse einen Platzhalterselektor („*“) hinzu, um die Schriftgröße wieder auf ihren Wert zu setzen Anfangswert:

.entry * {
  font-size: initial;
}

Standardmäßig erben alle Elemente die Schriftgröße ihrer Eltern. Wenn Sie jedoch die Schriftgröße der Klasse „.entry“ auf 0 setzen, verbergen Sie effektiv alle untergeordneten Elemente. Der Platzhalter-Selektor überschreibt dann diese Einstellung für alle verschachtelten Elemente, sodass deren Text angezeigt werden kann.

Beispiel:

Wenden Sie in Ihrem Code die Klasse „.entry“ an zum übergeordneten Div und stellen Sie sicher, dass der Text „Enter“ in diese Klasse fällt:

<div>

Mit diesem CSS-Trick wird der Text „Enter“ Text wird ausgeblendet, während der Rest des Inhalts innerhalb der „.entry“-Klasse sichtbar bleibt.

Das obige ist der detaillierte Inhalt vonWie kann ich Text ohne Tags in HTML ausblenden, indem ich nur CSS verwende?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!