91504


こちらのspanには適用させず、

[code]

    <div>テキスト<span>テスト1</span>テキスト<div>
    
[/code]

こちらのspanには適用できるセレクタを探しています。

[code]

    <div><span>テスト2</span>テキスト<div>
    
[/code]

divの直下かつ先頭（テキストを除く）という擬似クラス等はないのでしょうか。


CC BY-SA 4.0
2022-10-08T13:09:52.040
91498
2022-10-09T14:10:04.143
2022-10-09T14:10:04.143
3054
46729
question
html css html5
あるセレクタの直下かつ先頭というCSSセレクタはありますか？


たぶんできないと思います。

HTMLは、[DOM; Document Object
Model](https://developer.mozilla.org/ja/docs/Web/API/Document_Object_Model/Introduction)で表現されますが、これは

  * Document
  * Node
  * Element
  * Attr

などで表現されます。  
CSSセレクタでは、ElementやAttrは扱えますが、それ以外のNodeを扱うものは用意されていません。  
ここで質問の例において、`<span>`
Elementと兄弟になっている`テキスト`の部分はTextNodeと呼ばれ、ElementでもAttrでもありません。  
このため、CSSセレクタではTextNodeの存在・不存在どちらも表現することはできないと思われます。


CC BY-SA 4.0
2022-10-09T08:26:37.117
91504
2022-10-09T08:26:37.117
4236
91498
answer


Mozilla (Firefox) の拡張には [`:-moz-first-
node`](https://developer.mozilla.org/ja/docs/Web/CSS/:-moz-first-node)
という、ずばりの物が有るのですが、標準化の予定は無いとの事です。これの代替手段に触れた記述が見つからない所から見ても、標準の範囲では無理なのでしょう。


CC BY-SA 4.0
2022-10-09T14:08:11.667
91515
2022-10-09T14:08:11.667
3054
91498
answer