Wie gestalte ich die Beschriftung eines aktivierten Optionsfelds mit CSS?

CSS-Selektor zum Beschriften von aktivierten Optionsfeldern

Es stellt sich die Frage: Ist es möglich, eine mit einem aktivierten Optionsfeld verknüpfte Beschriftung mithilfe von CSS zu formatieren? ? Entgegen den Erwartungen liefert der Selektor „label:checked“ nicht das gewünschte Ergebnis.

Eine praktikable Lösung liegt in der Verwendung des benachbarten Geschwisterkombinators „ “. Dieser Kombinator verknüpft zwei Sequenzen von Selektoren, die ein gemeinsames übergeordnetes Element haben, wobei der zweite Selektor unmittelbar auf den ersten folgt.

Zum Beispiel zielt der Selektor „input[type="radio"]:checked label“ direkt auf Labels ab Befolgen Sie überprüfte Radioeingaben, unabhängig von ihrer Position im HTML Struktur.

Beispiel:

input[type="radio"]:checked+label { font-weight: bold; }

HTML:

<input>

Dieser Ansatz macht die Bezeichnung des deutlich fetter aktiviertes Optionsfeld, während die Beschriftungen nicht aktivierter Schaltflächen davon unberührt bleiben.

Das obige ist der detaillierte Inhalt vonWie gestalte ich die Beschriftung eines aktivierten Optionsfelds mit CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!