any-pointer
CSS
media feature
tests whether the user has
any
pointing device (such as a mouse), and if so, how accurate it is.
注意：
If you want to test the accuracy of the
primary
pointing device, use
pointer
代替。
any-pointer
feature is specified as a keyword value chosen from the list below.
none
No pointing device is available.
coarse
At least one input mechanism includes a pointing device of limited accuracy.
fine
At least one input mechanism includes an accurate pointing device.
注意：
More than one value can match if the available devices have different characteristics, although
none
only matches when none of them are pointing devices.
This example creates a small checkbox for users with at least one fine pointer and a large checkbox for users with at least one coarse pointer. The big checkbox takes precedence because it is declared after the small one.
<input id="test" type="checkbox" /> <label for="test">Look at me!</label>
input[type="checkbox"]:checked {
background: gray;
}
@media (any-pointer: fine) {
input[type="checkbox"] {
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
width: 15px;
height: 15px;
border: 1px solid blue;
}
}
@media (any-pointer: coarse) {
input[type="checkbox"] {
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
width: 30px;
height: 30px;
border: 2px solid red;
}
}
| 规范 | 状态 | 注释 |
|---|---|---|
|
Media Queries Level 4
The definition of 'any-pointer' in that specification. |
候选推荐 | 初始定义。 |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
any-pointer
media feature
|
Chrome 完整支持 41 | Edge 完整支持 12 | Firefox 完整支持 64 | IE 不支持 No | Opera 完整支持 28 | Safari 完整支持 9 | WebView Android 完整支持 41 | Chrome Android 完整支持 41 | Firefox Android 完整支持 64 | Opera Android 完整支持 28 | Safari iOS 完整支持 9 | Samsung Internet Android 完整支持 4.0 |
完整支持
不支持