チェックボックスを使用してCSS疑似を有効にする

Question

これが可能であるかどうかわかりません。しかし、基本的に私は擬似要素を使って追加のコンテンツをスライドしています。これは完全に機能します。しかし、私がやりたいことは、チェックボックスやラジオボタンがチェックされている場合は、これを表示してそのままにしておくことです。チェックボックスを使ってPseduo状態を騙すことは可能ですか？

基本的に、アクティブなPseduo状態をトリガーするチェックボックスが必要です。

誰が

すぎて現在の設定を変更せずにこれを行うための最善の方法を提案することができます

.client-link.has-content:target .client:after, 
.client-link.has-content:active .client:after, 
.client-link.has-content:focus .client:after { 
left:50%; 
} 

すべてのいただきありがとうございます。

Answer 1

はい、ただし、チェックボックスの直後に:after CSSを使用して要素を配置し、隣接する兄弟セレクタ+を使用してターゲットに設定するか（チェックボックスの後の任意の場所に）、それをターゲットにするには一般的な兄弟セレクタ~を使用します。

input[type="checkbox"]:checked + .foo:after { 
 
    content: 'foo'; 
 
}

<input type="checkbox"> 
 
<div class='foo'></div>