Comment puis-je masquer du texte non balisé en HTML à l'aide de CSS ?

Masquer du texte non balisé en HTML

En HTML, il est possible de masquer des fragments de texte qui ne sont entourés par aucune balise HTML. Ce texte, souvent appelé « texte brut », peut présenter un défi à masquer à l'aide de méthodes conventionnelles.

JavaScipt ou CSS ?

Comme l'utilisateur l'a mentionné, l'encapsulation le texte dans un div ou d'autres balises n'est pas pratique. Par conséquent, des méthodes alternatives telles que JavaScript ou CSS doivent être explorées.

Piratage CSS

Un hack CSS efficace pour masquer le texte brut consiste à manipuler la taille de la police :

.entry {
  font-size: 0;
}
.entry * {
  font-size: initial;
}

En définissant la taille de police du div du conteneur sur zéro, tous les éléments de ce conteneur auront également une taille de police de zéro, les masquant efficacement. Cependant, pour restaurer la visibilité des éléments tagués, la deuxième règle CSS rétablit la taille de la police à sa valeur initiale, garantissant ainsi que seul le texte non tagué reste masqué.

Exemple :

<div class="entry">
  <p class="page-header"><strong>Enter</strong></p>
  <p>something here</p>
  Enter (this will be hidden !!)
  <div class="subhead">another text here</div>
</div>

En appliquant le hack CSS à ce HTML, le texte "Entrée" après la balise "p" sera effectivement masqué, tandis que l'autre texte à l'intérieur du conteneur sera pas affecté.

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!