any-pointer

Baseline 已广泛支持

此功能已成熟，并可在许多设备和浏览器版本上运行。自 2018 年 12 月起，所有浏览器均支持此功能。

any-pointer CSS 媒体特性用于测试用户是否具有任何指针设备（例如鼠标），如果有，则测试其精度。

注意： 如果你想测试主要指针设备的精度，请改用 pointer。

语法

any-pointer 特性由以下列表中的一个关键字值指定。

none: 没有可用的指针设备。
coarse: 至少一个输入机制包含精度有限的指针设备。
fine: 至少一个输入机制包含精确的指针设备。

注意： 如果可用设备具有不同的特性，则可以匹配多个值，但 none 仅在它们都不是指针设备时才匹配。

示例

此示例为至少具有一个精确指针的用户创建了一个小复选框，为至少具有一个粗略指针的用户创建了一个大复选框。大复选框优先，因为它在小复选框之后声明。

HTML

html

<input id="test" type="checkbox" /> <label for="test">Look at me!</label>

CSS

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

浏览器兼容性

另见

pointer 媒体特性

帮助改进 MDN

了解如何贡献

本页面最后修改于 2025年7月14日，由 MDN 贡献者完成。

在 GitHub 上查看此页面 • 报告此内容的问题