javascript - CSSを使用して絵文字テキストを画像に置き換える

Question

純粋にCSSを使用してテキストをスパンオブジェクトに置き換える方法があるかどうか疑問に思いましたか？

例えば：

This is a :) sample text

上記の例の:)は次のように置き換えられます

This is a <span class="emot-smile"></span> sample text

または、テキスト自体を非表示にしてスパンを追加する類似のもの。

：beforeおよび：afterセレクターは私が使用できるものですか？

Answer 1

いいえ、純粋なCSSでは不可能です。

CSSはスタイリング用です。ページのコンテンツを動的に変更するには、Javascriptを使用する必要があります。この笑顔のために：

var str = "This is a :) sample text";
str = str.replace(":)", "<span class='emot-smile'>replaced span</span>");

document.write( str );​

Answer 2

いいえ。CSSはコンテンツをラップしてDOMツリーを変更することはできません。