Können Sie Attributwerte als CSS-Selektoren verwenden?

Können Attributwerte als CSS-Selektoren verwendet werden?

Die dynamische Aktualisierung von CSS basierend auf Eingabewerten ist eine häufige Anforderung in der Webentwicklung. Browser unterstützen diese Funktionalität nicht grundsätzlich, da CSS-Selektoren normalerweise auf statische Attribute abzielen.

Dynamische Werte

Wie erläutert, zielen einfache CSS-Regeln auf Attributwerte ab, nicht auf die tatsächlichen Werte. Für dynamische Updates kann JavaScript verwendet werden, um CSS basierend auf Eingabewerten zu manipulieren.

Ursprüngliche Antwort

Statisches Werte-Targeting ist jedoch weiterhin mit CSS-Attributselektoren möglich:

<code class="css">input[value="United States"] { color: #F90; }</code>

Dieser Selektor zielt auf Eingaben mit dem Wertattribut „USA“ ab und setzt die Textfarbe auf Rot.

CSS-Attributselektoren

CSS-Attributselektoren referenzieren Eingabeattribute auf folgende Weise:

• [attr] – Entspricht Elementen mit einem festgelegten „attr“-Attribut, unabhängig vom Wert.
• [attr=val] – Entspricht Elementen mit einem „attr“-Attributwert gleich „ val".
• [attr~=val] – Entspricht Elementen mit einem „attr“-Attributwert, der „val“ enthält.
• [attr|=val] – Entspricht Elementen mit einem „attr“ Attributwert gleich „val“ oder beginnend mit „val-“.

Das obige ist der detaillierte Inhalt vonKönnen Sie Attributwerte als CSS-Selektoren verwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!