Índice

Compatibilidad con los navegadores

Como acabamos de ver, los módulos CSS3 evolucionan de forma regular. De modo que, además de seguir su evolución en el sitio del W3C, conviene saber si una propiedad concreta puede explotarse o no, y si se reconoce en cada navegador o incluso en función de la versión de los navegadores.

Para ello, la solución más extendida actualmente consiste en comprobar las propiedades en el sitio Can I use: http://caniuse.com.

images/C13-011.png

En el cuadro de texto superior Can I use, escriba el nombre de la propiedad que desea comprobar. La búsqueda y la visualización son dinámicas.

En la tabla mostrada dispone, para cada navegador y para las versiones más recientes, el nivel de compatibilidad. Para este ejemplo, con la propiedad box-shadow, solo el navegador Opera Mini (para smartphone) no reconoce esta propiedad (se muestra en fondo rojo).

images/C13-012.png

He aquí otro ejemplo, con la pseudo-clase :not(), donde solo Safari 9.1 e iOS Safari 9.3 (para los iPhone e iPad) reconocen esta propiedad.

images/C13-013.png

He aquí un último ejemplo, con la propiedad hyphen.

images/C13-014.png

Esta propiedad no se reconoce en Chrome 50, Opera 37, Opera Mini 8 ni Android Browser 50. Se reconoce en Internet Explorer 11, Edge 13, Firefox 46, Safari 9.1 e iOS Safari 9.3. Aunque para cada uno de estos navegadores (excepto en el caso de Firefox), el uso de los prefijos comerciales es obligatorio. Puede observar esta información mediante el pequeño recuadro amarillo en la esquina superior derecha del navegador correspondiente. ...