any-pointer
Медійна можливість CSS any-pointer
перевіряє, чи є у користувача будь-який вказівний пристрій (подібний до миші), і якщо так, то наскільки він точний.
[!NOTE] Якщо треба перевірити точність основного вказівного пристрою, використовуйте натомість
pointer
.
Синтаксис
Можливість any-pointer
задається як ключове слово, обране з наведеного нижче списку.
none
Немає доступних вказівних пристроїв.
coarse
Щонайменше один механізм введення включає вказівний пристрій обмеженої точності.
fine
Щонайменше один механізм введення включає точний вказівний пристрій.
[!NOTE] Може давати збіг більш ніж одне значення, якщо доступні пристрої мають різні характеристики, хоча
none
дає збіг лише тоді, коли жоден з них не є вказівним пристроєм.
Приклади
Цей приклад створює невелике поле для галочки для користувачів зі щонайменше одним точним вказівним пристроєм та велике поле для галочки для користувачів зі щонайменше одним обмежено точним вказівним пристроєм. Велике поле для галочки має пріоритет, оскільки воно оголошене після малого.
HTML
<input id="test" type="checkbox" /> <label for="test">Подивися на мене!</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;
}
}
Результат
Специфікації
Специфікація |
---|
Media Queries Level 4 (Media Queries 4) # any-input |
Сумісність із браузерами
desktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
any-pointer media feature
|
Chrome Full support 41 | Edge Full support 12 | Firefox Full support 64 | Internet Explorer No support Ні | Opera Full support 28 | Safari Full support 9 | WebView Android Full support 41 | Chrome Android Full support 41 | Firefox for Android Full support 64 | Opera Android Full support 28 | Safari on iOS Full support 9 | Samsung Internet Full support 4.0 |