El css que muestro a continuaciín es el ejemplo que utilizaremos para la adpatación.
min-width:Es la menor cantidad de pixeles en la que se verá esa resolución.
max-width:Es la máxima anchura de pixeles en la que se verá esa resolucion
Código:
@media only screen and (min-width:100px) and (max-width:500px){
body{
background-color:red;
}
}
@media only screen and (min-width:500px) and (max-width:1000px){
body{
background-color:yellow;
}
}
@media only screen and (min-width:1000px) and (max-width:2000px){
body{
background-color:green;
}
}
Si os vais a poner a trabajar con este código recomiendo saber un poco antes de css.
@media only screen and (min-width:100px) and (max-width:500px){
body{
background-color:red;
}
}
@media only screen and (min-width:500px) and (max-width:1000px){
body{
background-color:yellow;
}
}
@media only screen and (min-width:1000px) and (max-width:2000px){
body{
background-color:green;
}
}
que es lo que hace exactamente?, porque hay 3 body definididos?, como funciona? algo de explicacion seria lindo no?...
esta linea
Código:
@media only screen and (min-width:1000px) and (max-width:2000px)
se agrega a todos los contenedores definidos, o solo a body? ._. ______________
que es lo que hace exactamente?, porque hay 3 body definididos?, como funciona? algo de explicacion seria lindo no?...
esta linea
Código:
@media only screen and (min-width:1000px) and (max-width:2000px)
se agrega a todos los contenedores definidos, o solo a body? ._.
lo que hace exactamente es mostrar el contenido de acuerdo al tamaño del navegador por ejemplo el que usted marco dice @media only screen and (min-width:1000px) and (max-width:2000px) significa que la pantalla si tiene un tamaño minimo de 1000px hasta 2000px mostrara el css indicado. Si es un diseño para mobiles yo recomiendo agregar handheld si es un diseño para movil
ejemplo
Código:
@handheld, media only screen and (min-width:350px) and (max-width:640px)
Claro, gracias por aclararlo:) Aqui el diseño es muy cutre pero si te lo curras puedes hacer una buena utilizacion del código y como en otros casos he dicho soy muy malo explicando xd
Ultima edición por cursopwg el Mar Dic 04, 2012 4:26 am; editado 1 vez
Claro, gracias por aclararlo:) Aqui el diseño es muy cutre pero si te lo curras puedes hacer una buena utilizacion del código y como en otros casos he dicho soy muy malo explicando xd
todo bien, entiendo darknet... si sos muy malo explicando, con que motivo haces tutoriales ? para que no se entiendan :B? ______________
Hola ...
Estaría genial que publiques algunas IMÁGENES en tus Tutoriales aportes que hagas , porque uno que no sabe , no tiene idea lo que esta asiendo
Las cookies son pequeños fragmentos de información de texto que nosotros o nuestros socios, almacenamos sobre usted de forma local por medio de su navegador.
Puede evitar el uso de cookies en cualquier momento a través de la configuración de su navegador.
Usamos las siguientes cookies que cumplen con el GDPR:
- Cookies esenciales: son absolutamente necesarias para que el sitio web sea completamente funcional.
- Cookies opcionales: son opcionales y nos ayudan a mejorar el sitio web, por ej. analizando el comportamiento de uso del sitio web sin identificarle personalmente.
Puede encontrar más información en nuestra sección de protección de datos/privacidad.
