Q&A
https://developer.mozilla.org/ja/docs/Web/CSS/:has
質問者さん、この疑似クラスはすべてのブラウザが未対応になっているので気をつけてください。
気を付けてくださいというか、使ってはいけません。
CSSで弟要素を指定することは出来ます
p + span {
color: green;
}
こうすれば、p要素の次のspan要素に対して文字を緑にすることが出来ますが、
今回の質問は、その逆をしたいという事です。
次にspan要素を従えるようなp要素を指定するにはどうしたらいいですか？
回答2件
0
CSS3の現状では、CSSでは無理ですね。JSを使うことになります。
【意外と便利！】特定の子要素を持つ親要素にcssを適用する方法 | Web | マイホームブログ | Web屋の芝生DIY
投稿2020/09/27 11:04
総合スコア33782
0
ベストアンサー
:has()
CSSで兄要素を指定したい
:has() が実装されれば、CSSで指定できるようになるでしょう。
css
1p:has(+span) { 2 color: green; 3}
Re: infologicmation さん
投稿2020/09/27 10:47
総合スコア18166
この回答に高評価 2 とは、この質問者さんはよほど嫌われているようですね。
caniuseのリンクが提示されていますし、「実装されれば」という言葉には「実装されていない」が含意されているのではないかな、と感じました。
一応、ポリフィルを置いておきますね。
https://www.npmjs.com/package/css-has-pseudo
@Lhankor_Mhy さん
フォローありがとうございます。
回答の意図は仰る通りです。
「CSSでの指定方法」を問う質問でしたので、仕様上の「CSSでの指定方法」を回答し、実装状況をcaniuseで示しました。
低評価した方へ
間違いがあれば修正しますので、教えて頂けると助かります。
なるほど、ポリフィルを回答ではなく第三者がコメントに置いてもいいわけですね？
低評価したのは私です。
非常に悪意のある回答だと思います。
普段なら MDN を引いているはずの人が、使えないことを示すリンクをわざわざ英語のものにして二番目に置くような。
例示が足りなかっただけで何も間違っていない資料を「誤解を生む」とあれほど粘着した人とは思えません。
そして、think49 さんに今まで与えられている高評価の少なくない部分がクラスタによる組織票だということも想像できますね。
少なくとも今回は間違いなくそう評価できます。
現在どうすればいいかを聞いている質問に対し、何の注意もなく確定していない未来の話をするなど、決して高評価に値する回答とは言えません。
@Zuishin さん
そうですか。わかりました。
この回答が悪質なのは、一見正しそうに見えるところです。知識を持った人でなければ見抜くことができず、抱える問題の解決法を求めて teratail を訪れた人に間違いを教えます。
「嘘はついていない」と言い訳をしながら意図的に誤解を与える回答です。
質問者です。回答ありがとう。
現状、CSSでは無理と言うことなので別の方法で考えようと思います。
CSS では無理と書いているのはもう一つの回答ですがね。
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。