Comment puis-je masquer du texte non balisé en HTML en utilisant uniquement CSS ?

Masquer le texte sans balises HTML dans HTML

Problème :

Vous avez du code HTML contenant texte dépourvu de balises HTML environnantes. Plus précisément, vous souhaitez masquer le texte « Entrée » situé immédiatement après une balise « p ». Cependant, il n'est pas possible d'envelopper le texte avec un élément HTML.

Solution : CSS Font-Size Trick

Pour atteindre votre objectif, vous pouvez utiliser un hack CSS en tirant parti de la propriété font-size :

1. Créez une classe, par ex. ".entry", et attribuez-lui une taille de police de 0 :

.entry {
  font-size: 0;
}

2. Dans cette classe, ajoutez un sélecteur de caractère générique ("*") pour redéfinir la taille de police à sa valeur initiale :

.entry * {
  font-size: initial;
}

Par défaut, tous les éléments héritent de la taille de police de leurs parents. Cependant, en définissant la taille de police de la classe « .entry » sur 0, vous masquez efficacement tous ses éléments enfants. Le sélecteur de caractère générique remplace ensuite ce paramètre pour tous les éléments imbriqués, permettant ainsi l'affichage de leur texte.

Exemple :

Dans votre code, appliquez la classe ".entry". au div parent et assurez-vous que le texte "Entrée" appartient à cette classe :

<div>

Avec cette astuce CSS, le texte "Entrée" sera masqué tandis que le reste du contenu de la classe ".entry" reste visible.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!