CSS：2つの一般的なセレクタを使用して同じ要素を選択する

Question

一般的な兄弟を使用して同じ要素を選択する方法を教えてください。これを私はチェックボックス：チェックされたテクニックをスイッチとして使用する必要があった（いくつかの実験）。 CSSのための

input:checked:after{ 
 
//I wanted two psuedo class to work together 
 
//but this selector isnt valid 
 
    
 
    content:"text"; 
 
} 
 

 
//so i tried below 
 

 
input:checked ~ span ~ input:after{ 
 
    content:"text"; 
 

 
//but above isnt working either 
 
}

<input type="checkbox" checked><span></span>

Answer 1

コメントマークを実行するには、あなたのCSSを得るために

/* Comment */ 

のように、私は上記の、それら//マークを削除しなければならなかったです。 HTMLと

input[type='checkbox']:checked ~ span::after{ 
    content:'text'; 
} 

： 私はこのように動作するようにコードを取得することができました

<input type="checkbox" checked><span></span> 

私の出力は、それの後に単語「テキスト」とチェックをチェックボックスでした。私は疑似要素のダブルコロンマークが必要であることに注意してください。これは、 "checked"で使用される疑似クラスのコロンマークとは少し異なります。

参照： https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elementshttps://www.w3.org/TR/css3-selectors/