pointer

This translation is incomplete. Please help translate this article from English

La caracteristica pointer CSS comprueba si el usuario tiene un dispositivo de puntero (como el ratón), y si es así, cuán preciso es el dispositivo de puntero primario.

Nota: Si quieres comprobar la precisión de cualquier dispositivo apuntador, usa any-pointer en su lugar.

Sintaxis

La propiedad pointer se especifica como un valor de palabra clave elegido de la lista que figura a continuación.

none
El mecanismo de entrada principal no incluye un dispositivo apuntador.
coarse
El mecanismo primario de entrada incluye un dispositivo de apuntamiento de precisión limitada.
fine
El mecanismo de entrada principal incluye un dispositivo de apuntamiento preciso.

Ejemplo

Este ejemplo crea una pequeño checkbox para los usuarios con punteros primarios finos y un gran checkbox para los usuarios con punteros primarios gruesos.

HTML

<input id="test" type="checkbox" />
<label for="test">Mírame!</label>

CSS

input[type="checkbox"] {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border: solid;
  margin: 0;
}

input[type="checkbox"]:checked {
  background: gray;
}

@media (pointer: fine) {
  input[type="checkbox"] {
    width: 15px;
    height: 15px;
    border-width: 1px;
    border-color: blue;
  }
}

@media (pointer: coarse) {
  input[type="checkbox"] {
    width: 30px;
    height: 30px;
    border-width: 2px;
    border-color: red;
  }
}

Resultado

Especificación

Especificación Status Comentario
Media Queries Level 4
La definición de 'pointer' en esta especificación.
Candidate Recommendation Initial definition.

Compatibilidad

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome para AndroidFirefox para AndroidOpera para AndroidSafari en iOSSamsung Internet
pointer media featureChrome Soporte completo 41Edge Soporte completo 12Firefox Soporte completo 64IE Sin soporte NoOpera Soporte completo 28Safari Soporte completo 9WebView Android Soporte completo 41Chrome Android Soporte completo 50Firefox Android Soporte completo 64Opera Android Soporte completo 28Safari iOS Soporte completo 9Samsung Internet Android Soporte completo 5.0

Leyenda

Soporte completo  
Soporte completo
Sin soporte  
Sin soporte

Ver también