CSS を使用して HTML 内のタグなしテキストを非表示にするにはどうすればよいですか?

HTML でのタグなしテキストの非表示

HTML では、HTML タグで囲まれていないテキストの断片を非表示にすることができます。このテキストは「プレーン テキスト」と呼ばれることが多く、従来の方法を使用して非表示にするのは困難です。

JavaScipt または CSS?

ユーザーが述べたように、ラッピングdiv または他のタグ内のテキストは実用的ではありません。したがって、JavaScript や CSS などの代替方法を検討する必要があります。

CSS ハッキング

プレーン テキストを非表示にする効果的な CSS ハックの 1 つは、フォント サイズの操作です。

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

コンテナ div のフォント サイズをゼロに設定すると、そのコンテナ内のすべての要素にもフォントサイズをゼロにして、事実上非表示にします。ただし、タグ付けされた要素の表示を復元するために、2 番目の CSS ルールはフォント サイズを初期値に戻し、タグ付けされていないテキストのみが非表示のままになるようにします。

例:

<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>

この HTML に CSS ハックを適用すると、「p」タグの後の「Enter」テキストが効果的に非表示になり、その中の他のテキストは非表示になります。コンテナは影響を受けません。

以上がCSS を使用して HTML 内のタグなしテキストを非表示にするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。