Hoy es el quinto día de la nueva compañía, comenzando a las manos del proyecto, para hacer algo que es similar a NetEase uno de yuanes para comprar este tipo de productos, también hay Andrews ios H5 sitio de la plataforma, un total de tres canales. En primer código de la cabeza la cabeza introdujo flexible.js. (Sal: sensación que demonios, que no sé lo está haciendo como un trabajo de casi un año y medio de la parte delantera del blanco, a excepción de las páginas de respuesta, no han hecho una página H5 verdaderamente móvil, dijo que estaba ansioso 2.333.333. ) bien, preámbulos, vamos a entrar en el negocio.
Por ejemplo, ha recibido hoy una hermana de un diseño de interfaz de usuario, que no estaba muy claro para las diversas especificaciones de tamaño auricular. Generalmente lo que sé, por lo general 750px de ancho de. Cómo cortar y escribir CSS ella? Los detalles específicos se puede acceder ( HTTP: //www.jb51.net/article/7 ... , por la siguiente reimpresión aquí). iPhone6 anchura es 375pt, debido pantalla retina, las secciones de banda y las secciones extremas por lo general no es el mismo.
Posible solución al problema es la pantalla retina (con 750px 1334px * proyecto de diseño, por ejemplo):
1) En devicePixelRatio <= 2, usando la imagen unificada 750 de la figura corte proyecto de diseño
2) En devicePixelRatio> = 2, utilizando una imagen unificada 750 * 1.5 = 1125, que es el llamado @ 3x proyecto de diseño de planes de corte.
Según la técnica de corte de diseño por estirado bajo 750 * 1334 se colocan img / @ 2x esta carpeta.
Luego dejar que el diseño de proyecto de arte vector 750 de aumento de 1,5 veces, y luego se corta para proporcionar la misma de acuerdo con la figura @ 3x figura corte requisitos, y se coloca img / @ 3x esta carpeta:
Después de usar este js, no escriba
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
Flexible.js para procesamiento automático.
Escribir un requisito básico de CSS:
1) Además del tamaño de fuente, otros tamaños son emitidos de acuerdo con el tamaño de la etiqueta 750, se convierte en un valor en el método de conversión de unidades de rem: etiquetas proyecto de anotación tamaño / fuente de referencia tamaño emitidos;
2) Proyecto de etiquetado size = etiquetas fuente estándar emitidos ancho / 10, como se denota emitido anchura 750 proyecto denotado tamaño de fuente estándar es de 75; denotado emitido anchura 640 proyecto denotado tamaño de fuente estándar es 64; (así Taobao esta realización es para su uso en cualquier diseño de proyecto de tamaño)
3) Si es necesario configurar el tamaño de fuente, puede ser permitido a la propiedad de datos HTML-DPR al procesamiento similar a la siguiente redacción:
[data-dpr="2"] p { font-size: 16px; }
[data-dpr="3"] p { font-size: 24px; }