<option>要素に影響するために、{content： ''}の前にCSS疑似要素を使用するにはどうすればよいですか？

私はoptonsのリストを持っていますが、どのようにCSS擬似要素を使用できますか：{content： ''}の前に<option>に影響しますか？下には、それぞれの前にテキストを挿入する3つのオプションがあります。<option>要素に影響するために、{content： ''}の前にCSS疑似要素を使用するにはどうすればよいですか？

これはjavascript/jQueryで行うことができますが、CSSでは可能ですか？

<html> 
<head> 
    <style> 

     option::before { 
      content: "sandy - " 
     } 

    </style> 


</head> 
<body> 

<select> 
    <option>beach</option> 
    <option>field</option> 
    <option>carpet</option> 
</select> 


</body> 
</html>

出典

2012-02-08 cwd

彼の答えはj08691で述べたように、 '：before'はCSS3には新しいものではありません。「疑似要素」とも呼ばれています。元の質問の「疑似」タグはおそらくそこにあります。なぜなら、そのタグが燃え尽きたためです。 – BoltClock

::beforeと::after疑似要素は実際に要素に子ノードを追加/追加するため、子ノードを含めることができない要素では機能しません。

それはやっての（おおよそ）と等価になります：あなたはテキスト値を更新する場合は、JavaScriptを使用する必要があります

<option><span>sandy - </span>beach</option>

。

出典

2012-02-08 17:34:03

擬似要素*は空要素にも影響を与える可能性があります（空の内容の前後に内容を挿入します）。また、 'option'要素も空ではありません。 –

これは現時点では不可能です。 W3によると、 "この仕様では、置き換えられた要素（HTMLのIMGなど）と：beforeと：afterの相互作用を完全には定義していません。いくつかの置換要素は<IMG>タグ、プラグイン（<オブジェクト>タグ）、及びフォーム要素（<ボタン>、<TEXTAREA>、<入力>、及び< >タグを選択）です。

ただし、これはJavaScriptで行うことができます。ああ、BTW、content：、：before、：afterはCSS 2.1です。

出典

2012-02-08 17:32:09 j08691

'：before'はCSS3には新しいものではありませんが、' :: before'という二重コロン表記があります。 Fableは、私たちがIE8ユーザーを健全に保つためにシングルコロン表記を使用し続けるべきだが、私は逃げる。 – BoltClock

また、 '：before'と'：after''疑似要素*を使ったコンテンツ生成は '

<option>要素に影響するために、{content： ''}の前にCSS疑似要素を使用するにはどうすればよいですか？

答えて