Recurso CSS: web responsive

/* Smartphones (portrait y landscape) */  
@media only screen and (min-device-width:320px) and (max-device-width:480px){  
     /* Estilos */  
}  
/* Smartphones (landscape) */  
@media only screen and (min-width:321px){  
     /* Estilos */  
}  
/* Smartphones (portrait) */  
@media only screen and (max-width:320px){  
     /* Estilos */  
}  
/* iPads (portrait y landscape) */  
@media only screen and (min-device-width:768px) and (max-device-width:1024px){  
     /* Estilos */  
}  
/* iPads (landscape) */  
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape){  
     /* Estilos */  
}  
/* iPads (portrait) */  
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait){  
     /* Estilos */  
}  
/* Desktops and Laptops */  
@media only screen and (min-width:1224px){  
     /* Estilos */  
}  
/* Large Screens */  
@media only screen and (min-width:1824px){  
     /* Estilos */  
}  
/* iPhone 4 */  
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-device-pixel-ratio:1.5){  
     /* Estilos */  
}

Write a Reply or Comment

Your email address will not be published.