Medidas
960px 768px 480px 320px 200px
/************************* Base ******************************/
/************************* Ejemplo. 960px ******************************/
/*style.css*/
/************************* Responsive Design ******************************/
/************************* 960px - 1200px ******************************/
@media only screen and (min-width: 960px) and (max-width: 1200px) {
}
/************************* 768px - 960px ******************************/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}
/************************* 480px - 768px ******************************/
@media only screen and (min-width: 480px) and (max-width: 767px) {
}
/************************* 320px - 480px ******************************/
@media only screen and (min-width: 320px) and (max-width: 479px) {
}
/************************* 200px - 320px ******************************/
@media only screen and (min-width: 0px) and (max-width: 319px) {
}
Icono
<meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="shortcut icon" href="/favicon.ico" type="image/vnd.microsoft.icon" /> <!-- For non-Retina iPhone, iPod Touch, and Android 2.2+ devices: --> <link rel="apple-touch-icon" href="/img/WMB_57x57.png" /> <!-- For first-generation iPad: --> <link rel="apple-touch-icon" sizes="72x72" href="/img/WMB_72x72.png" /> <!-- For iPhone 4 with high-resolution Retina display: --> <link rel="apple-touch-icon" sizes="114x114" href="/img/WMB_114x114.png" /> <!-- No such device exists yet, so if this value is used, it means the sizes attribute is ignored: --> <link rel="apple-touch-icon" sizes="228x228" href="/img/WMB_228x228.png" />
