ホームページ > ウェブフロントエンド > CSSチュートリアル > 他の要素を表示したまま、CSS を使用して Div 内のテキスト ノードを非表示にするにはどうすればよいですか?

他の要素を表示したまま、CSS を使用して Div 内のテキスト ノードを非表示にするにはどうすればよいですか?

Linda Hamilton
リリース: 2024-12-07 21:27:13
オリジナル
1009 人が閲覧しました

How Can I Hide Text Nodes in a Div Using CSS While Keeping Other Elements Visible?

CSS で要素のテキスト ノードを非表示にする

アンカー タグとテキスト ノードを含む div 要素があります。 div やアンカー タグの可視性に影響を与えずに、テキスト ノードのみを非表示にしたいとします。これを実現するには、visibility 属性を使用できます。

CSS ソリューション

次の CSS コードで目的を達成できます。

#closelink {
  visibility: collapse;
}

#closelink a {
  visibility: visible;
}
ログイン後にコピー

このコード内:

  • #closelink は、div とテキストを含むその内容全体を非表示にしますnode.
  • #closelink a は div 内のアンカー タグの可視性属性をオーバーライドし、再度表示できるようにします。

HTML

HTML は変更されません:

<div>
ログイン後にコピー

この CSS ソリューションは、テキスト ノード「クリックして」を効果的に非表示にします。 div とアンカータグを表示したままにして「close」します。

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

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート