any-pointer

Базовая линия Широко доступна

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с декабря 2018 года.

Функция any-pointer CSS свойство среды проверяет, есть ли у пользователя любое указывающее устройство (например, мышь), и, если есть, насколько оно точно.

Примечание: Если вы хотите проверить точность главного указывающего устройства, используйте pointer вместо этого.

Синтаксис

Функция any-pointer задается как ключевое значение, выбранное из списка ниже.

none: Указывающее устройство недоступно.
coarse: По крайней мере, один механизм ввода включает указывающее устройство с ограниченной точностью.
fine: По крайней мере, один механизм ввода включает точное указывающее устройство.

Примечание: Может соответствовать несколько значений, если у доступных устройств разные характеристики, хотя none соответствует только тогда, когда ни одно из них не является указывающим устройством.

Примеры

В этом примере создается небольшая галочка для пользователей с по крайней мере одним точным указателем и большая галочка для пользователей с по крайней мере одним грубым указателем. Большая галочка имеет приоритет, потому что она объявлена после маленькой.

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;
  }
}

Результат

Спецификации

Спецификация
Уровни сред запросов 4 # any-input

Совместимость браузеров

	Рабочий стол					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`any-pointer`	41	12	64	28	9	41	64	28	9	4.0	41

См. также

Функция среды pointer

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/@media/any-pointer