CSSセレクタ - クラスの後にコンテンツが設定されていない場合

Question

現在、次の要素がイメージであるか特定のクラス名を持っている場合、CSSクラス内のコンテンツの設定を解除しようとしています。

構造

私が得た最初要素には固有のID（iを1に設定することはできません）とa:hrefあります。この要素は、::before（アイコン）でさらに擬似要素を作成します。

第要素は、A内の画像のクラスである：HREF

例：

<a href="https://example.org/assets/uploads/2015/02/A-Upload.jpg"> 
<img class="alignright wp-image-8184 size-medium" width="300" height="188" sizes="(max-width: 300px) 100vw, 300px" srcset="https://example.org/assets/uploads/2015/02/A-Upload-300x188.jpg 300w, https://example.org/assets/uploads/2015/02/A-Upload-1600x1000.jpg 1600w" alt="test" src="https://example.org/assets/uploads/2015/02/xA-Upload-300x188.jpg.pagespeed.ic.H4F1dyfjOe.jpg"> 
</a> 

Iは、CSSセレクタを使用して、Aから::beforeコンテンツを削除したい場合、第二要素は画像であるか、特定のCSSクラスを持っています。

私は今、成功しなかった

#main-content .content .post-inner .entry p a::before ~ img.alignright{ 
content: unset!important; 
} 

のようないくつかの方法を試してみました。私は誰かが私が間違っていた可能性があることを教えてくれることを願っています。

Answer 1

現在のところ、CSSだけで子要素に基づいて親要素をスタイルする方法はありません。あなたがしようとしていることは、単にCSS3では不可能です。

a（または別の親ノード）にクラスを追加してリファレンスとして使用するか、子に基づいて親のスタイルを更新するためにJavaScriptを使用する必要がありますimg.alignright。

提案されている:has()セレクタがありますが、現時点ではどのブラウザもサポートしていないと思います。構文は次のようになります。

a:has(> img.alignright):before { 
    content: unset; 
} 

しかし、再び、これはちょうどa draft of CSS 4にまだ出の方法でされて、私は確信しています。