1

estoy leyendo un libro de html5,css3 y javascript editado en el año 2012 y tengo una duda sobre el uso de los siguientes prefijos:

•-moz- para Firefox.

• -webkit- para Safari y Chrome.

• -o- para Opera.

• -khtml- para Konqueror.

• -ms- para Internet Explorer.

• -chrome- específico para Google Chrome.

En el libro aclara:

IMPORTANTE: En este momento las nuevas incorporaciones de CSS3 están siendo implementadas en las últimas versiones de los navegadores más populares, pero algunas de ellas se encuentran aún en estado experimental. Por esta razón, estos nuevos estilos deberán ser precedidos por prefijos tales como –moz- o -webkitpara ser efectivamente interpretados. Analizaremos este importante asunto más adelante.

Ejemplo de codigo .css:

div {
 width: 100px;
 margin: 20px;
 padding: 10px;
 border: 1px solid #000000;

 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
} 

Lo que quiero saber:

Han pasado 8 años desde la publicación del libro y no sé si siguen siendo obligatorios o se a optimizado con otro estándar, ¿podría sacarme de dudas?

Muchas gracias por su tiempo :)

4
  • Podrias indicamre donde encontrar un hilo que me explique la actualidad de los usos en estos prefijos? gracias
    – Eric
    Commented el 11 jul. 2020 a las 1:15
  • perdona mi ignorancia pero no se donde encontrar esta funcion dentro de esta web. Como dices reportes hay, antes de publicar he observado la de posibles temas parecidos y no encontre la respuesta a tal duda. Si dispones del link donde comprovar esta informacion te lo agradezco.
    – Eric
    Commented el 11 jul. 2020 a las 1:28
  • Wow! se me escapo de la vista el link! MUCHAS GRACIAS POR LA PAGINA WEB!!!!
    – Eric
    Commented el 11 jul. 2020 a las 1:34
  • Pues ya esta, sinceramente respondiste mi duda! esta web es una gran herramienta :D!!! Muchas gracias por la colaboracion ^^
    – Eric
    Commented el 11 jul. 2020 a las 1:45

1 respuesta 1

2

Hay básicamente dos problemas que obligan a usar lo que se conoce como vendor prefix

A. La compatibilidad entre versiones

Un alto porcentaje del código de CSS3 es soportado en la mayoría de navegadores modernos. Ahora bien, en la comunidad de programadores hay debate incluso sobre qué navegadores (y a partir de qué versiones) se pueden considerar modernos.

Pero esa compatibilidad es a partir de una determinada versión del navegador. Por lo tanto, deberás seguir poniendo en tu código los fragmentos relativos al vendor prefix, porque cualquier usuario de tu página puede estar usando una versión de navegador no compatible con ese selector o función CSS.

Existe un sitio llamado caniuse.com donde puedes verificar la compatibilidad por navegadores y versiones de un determinado selector o propiedad. Si estás escribiendo una biblioteca, framework o simplemente para el CSS de tu sitio web, deberás consultar en ese sitio la compatibilidad, para decidir de qué forma escribir el código CSS de esas nuevas funciones.

En canisue.com sólo tienes que escribir en el cuadro superior la propiedad que quieres verificar, la pantalla se actualiza y verás toda la información que se ofrece. Veamos una imagen con algunas explicaciones:

introducir la descripción de la imagen aquí

Basándonos en dos casos podremos comprender que es casi imposible librarse (por completo) de usar los vendor prefix.

  1. En el caso de border-box, es compatible con el 98.24% de los navegadores (nº 3 en la imagen). Pero, si observas en algunos recuadros verdes, verás dentro de ellos unos pequeños recuadros amarillos. Si pones el puntero sobre cualquiera de ellos verás de qué se trata:

    introducir la descripción de la imagen aquí

    Se lee claramente: Supported with prefix -webkit-. Significa que para hacer funcionar border-box en esas versiones (las que tienen el recuadro pequeño amarillo), tienes que usar el prefijo -webkit- en el código CSS.

  2. En el caso de los efectos de filtro la cosa cambia, porque hay incompatibilidades en casi todos los navegadores, y dicha incomptibilidad se resuelve en algunos casos aplicando solamente webkit y en otros (todos los de rojo) tendrás que asegurar compatibilidad mediante código propio para cada navegador usando el vendor prefix propio de ese navegador.

    introducir la descripción de la imagen aquí

B. La variedad de navegadores y la incapacidad para ponerse de acuerdo

Este fue un gran problema (sobre todo en el pasado) que obligaba a seguir usando los prefijos. Hoy día los desarrolladores de cada navegador han empezado a ponerse de acuerdo. Por eso puedes ver que en las recientes versiones de navegadores, el prefijo webkit se va universalizando, de modo que para la compatibilidad con la mayoría de navegadores, es suficiente con usar dicho prefijo.

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.