ホームページ >ウェブフロントエンド >CSSチュートリアル >HTML タグ内のテキストを含めて、テキスト コンテンツを CSS に置き換えるにはどうすればよいですか?

HTML タグ内のテキストを含めて、テキスト コンテンツを CSS に置き換えるにはどうすればよいですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-12-21 10:15:11300ブラウズ

How Can I Replace Text Content with CSS, Including Text Within HTML Tags?

CSS でのテキストの置換

content プロパティを使用して元のテキストのコンテンツをオーバーライドすることで、テキストを CSS で置換できます。ただし、CSS を使用して角括弧 ([]) で囲まれたテキストを直接置換することはできません。

角括弧内のテキストを置換するには、次の方法を使用できます。

.pvw-title span {
  display: none;
}

.pvw-title:after {
  content: 'whatever it is you want to add';
}

このコードではでは、元のテキスト (「事実」) を で囲みます。要素を作成し、CSS を使用して非表示にします。次に、:after 疑似要素を使用して、必要な置換テキスト コンテンツを追加します。

例:

<div class="pvw-title"><span>Facts</span></div>

これにより、ページには「事実」が表示されますが、実際のテキストはCSSを使用して非表示にします。 :after 疑似要素は、その場所に表示される置換テキストを表示します。

以上がHTML タグ内のテキストを含めて、テキスト コンテンツを CSS に置き換えるにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。