w3schools vmin vmax unidad tamaño son que medida los altura 50vh 100vh css viewport-units

css - unidad - vmin y vmax



CSS: ¿Las unidades de altura de vista(vh) y ancho de vista(vw) son ampliamente compatibles? (5)

Estoy usando 100vh para centrar una división verticalmente con la línea de altura. Este sitio pone soporte para vh y vw en alrededor del 70%, ¿es eso una evaluación justa? ¿Recomendaría usar unidades de ventana gráfica al construir un sitio? Sé que esto es un poco subjetivo, solo busco opiniones de desarrolladores web con más experiencia que yo.

EDIT: Gracias por la entrada de todos, quiero que se vea bien en el móvil, así que supongo que tendré que renunciar a vh.


Bueno, puedes ver que ya está allí para los navegadores de escritorio, y el soporte en dispositivos móviles es bastante limitado. Por lo tanto, realmente depende de si desea crear un sitio que se vea bien en las computadoras o un sitio basado en píxeles más compatible que también funcione en los teléfonos.


La estadística es clara y es una evaluación justa, desde mi punto de vista.

Creo que la decisión la tiene que tomar usted. Si desea hacer una prueba de futuro de su sitio web con la tecnología más avanzada, pero es consciente de que actualmente hay algunas desventajas, entonces, vaya.

Si no está preparado para invertir un poco más en su presencia en línea, entonces apéguese a la forma antigua, lo cual no es incorrecto.

EDITAR: Cuando quiero crear un diseño receptivo, comienzo a desarrollar para dispositivos móviles primero y luego creo la versión de escritorio, para garantizar que todas mis vistas funcionen correctamente, ya que en algunos puntos falta la compatibilidad con dispositivos móviles (especialmente vmax). PERO sobre esto, puedes preguntar a 50 muchachos y las posibilidades de que todos digan algo más son bastante buenos.


La página que has enlazado responde realmente a tu pregunta .

Depende de qué navegadores necesites soportar.

El soporte parcial en IE9 se refiere al soporte "vm" en lugar de "vmin". El soporte parcial en iOS7 se debe al comportamiento defectuoso de la unidad vh. Todo otro soporte parcial se refiere a no admitir la unidad "vmax".

Esto indica que el uso de unidades de ventana gráfica podría tener ''errores'' en iOS7. No recomendaría el uso de unidades de vista, sino que usaría:

  • Pixles: por ejemplo, height: 500px;
  • Porcentaje: por ejemplo, height: 50%;

Estos valores son ampliamente compatibles y producirán los mejores resultados.


Las unidades de vista son excelentes, pero la mayoría de los proveedores de navegadores móviles lograron hacer que vh no se pueda usar en la práctica.

Cuando comience a desplazarse o cambie la dirección de desplazamiento, la barra de direcciones desaparecerá o volverá; luego se detiene, suelta el dedo y el valor vh se actualizará repentinamente junto con cualquier elemento que lo use, lo que resultará en una pesadilla de UX (el usuario no espera que el tamaño cambie al final del desplazamiento, cambiando las proporciones de los elementos existentes, rediseñando el contenido, etc).


usa tanto CSS vh como jQuery, es más seguro.
Ejemplo de jQuery:

var clientHeight = $( window ).height(); $(''.element'').css(''height'', clientHeight);

y CSS:

.element {height: 100vh;}