Maison > interface Web > tutoriel CSS > Comment puis-je masquer le texte non balisé en HTML en utilisant uniquement CSS ?

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

Patricia Arquette
Libérer: 2024-12-25 06:14:16
original
373 Les gens l'ont consulté

How Can I Hide Un-tagged Text in HTML Using Only CSS?

Masquer le texte sans balises HTML dans HTML

Un utilisateur rencontre un défi lorsqu'une section particulière de texte dans un document HTML n'est pas entourée par toutes les balises HTML. Le but est de masquer ce texte sans l'envelopper dans un div ou un autre élément HTML.

Solution CSS

L'approche recommandée implique un hack CSS qui utilise la taille de la police. :

.entry {
  font-size: 0;
}

.entry * {
  font-size: initial;
}
Copier après la connexion

Lorsqu'il est appliqué au code HTML donné, ce CSS masque efficacement le texte souhaité tout en préservant la visibilité de l'autre elements :

<div class="entry">
  <p class="page-header">
Copier après la connexion

En définissant la taille de police de la classe ".entry" à 0, tous ses éléments enfants sont masqués. La deuxième règle rétablit ensuite sélectivement la taille de la police à sa valeur initiale, rétablissant ainsi la visibilité des éléments souhaités au sein du conteneur « .entry ».

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal