DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!
Die :enabled-Pseudoklasse in CSS wählt fokussierbare Elemente aus, die nicht deaktiviert und somit aktiviert sind. Sie ist nur mit Formularelementen (<input>, <select>, <textarea>) verbunden. Aktivierte Elemente sind solche, in die Sie Daten eingeben, die Sie auswählen oder die Sie fokussieren oder anklicken können.
Wenn also ein Kontrollkästchen aktiviert ist und Sie das direkt dahinterliegende Label ansprechen
input:enabled + label {
color: #333;
font-style: italic;
}Der Labeltext wird dunkelgrau und kursiv, wenn das Kontrollkästchen aktiviert ist, was bedeutet, dass der Benutzer es ein- und ausschalten kann.
Theoretisch sollte :enabled mit einem <a>, <area> oder <link> mit href Attributen übereinstimmen, aber Browser scheinen dieses Szenario nicht zu handhaben. Sie können <button>, <input>, <textarea>, <optgroup>, <option> und <fieldset>s stylen, die nicht deaktiviert sind. Wenn <menu> unterstützt wird, sollten wir auch <command> und <li> Elemente, die Kinder von <menu> sind, ansprechen können, wenn sie nicht deaktiviert sind.
Sie würden auch denken, dass Elemente mit contenteditable und tabindex Attributen mit der :enabled Pseudoklasse auswählbar wären. Die Spezifikation besagt dies nicht, und Browser unterstützen dies auch nicht.
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Alle | 3.1 | Alle | 9 | 9 | Alle | Alle |
Für eine Website, die CSS und HTML lehrt, haben Sie die langsamste Website, der ich seit langem begegnet bin.
Das Scrollen ist langsam und selbst das Eingeben von Zeichen in diesen Kommentarblock ist langsam.
Ich und ich bin sicher, andere werden Ihre Website infolgedessen meiden
Beste Grüße
Mir kommt es ziemlich schnell vor.
Wenn Sie sagen "Es ist nur mit Formularelementen (, , ) verbunden", meinen Sie alle Formularelemente? Oder nur die drei aufgeführten?
Es scheint, dass es sich um alle Formularelemente handeln kann? z. B. button:enabled.
Es ist mit jedem UI-Element in einem aktivierten Zustand verbunden. In den meisten (vielleicht allen?) Fällen sind dies Formularsteuerelemente, und Schaltflächen fallen in diese Kategorie.