any-pointer
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Dezember 2018.
Das any-pointer CSS Medienmerkmal prüft, ob der Benutzer irgendein Zeigegerät (wie eine Maus) besitzt und, falls ja, wie genau es ist.
Hinweis:
Wenn Sie die Genauigkeit des primären Zeigegeräts testen möchten, verwenden Sie stattdessen pointer.
Syntax
Das any-pointer Merkmal wird als Schlüsselwortwert angegeben, der aus der untenstehenden Liste ausgewählt wird.
none-
Kein Zeigegerät ist verfügbar.
coarse-
Mindestens ein Eingabemechanismus umfasst ein Zeigegerät mit begrenzter Genauigkeit.
fine-
Mindestens ein Eingabemechanismus umfasst ein genaues Zeigegerät.
Hinweis:
Es können mehr als ein Wert übereinstimmen, wenn die verfügbaren Geräte unterschiedliche Eigenschaften haben, obwohl none nur übereinstimmt, wenn keines von ihnen ein Zeigegerät ist.
Beispiele
Dieses Beispiel erstellt ein kleines Kontrollkästchen für Benutzer mit mindestens einem feinen Zeiger und ein großes Kontrollkästchen für Benutzer mit mindestens einem groben Zeiger. Das große Kontrollkästchen hat Vorrang, da es nach dem kleinen deklariert wird.
HTML
<input id="test" type="checkbox" /> <label for="test">Look at me!</label>
CSS
input[type="checkbox"]:checked {
background: gray;
}
@media (any-pointer: fine) {
input[type="checkbox"] {
appearance: none;
width: 15px;
height: 15px;
border: 1px solid blue;
}
}
@media (any-pointer: coarse) {
input[type="checkbox"] {
appearance: none;
width: 30px;
height: 30px;
border: 2px solid red;
}
}
Ergebnis
Spezifikationen
| Specification |
|---|
| Media Queries Level 4 # any-input |
Browser-Kompatibilität
Loading…