Calificación:
  • 0 voto(s) - 0 Media
  • 1
  • 2
  • 3
  • 4
  • 5
Diseño responsive
#1
Hola, estoy tratando de hacer mi plantilla responsive, utilizo blogger, mi duda es si cambiando el css todos los
Código:
width:px;
por "
Código:
width:100%; max-width:px;
" seria una forma correcta, ya que no consigo hacer funcionar el css media queries.
#2
Ya que se nombra el tema.

Las plantillas responsive son las que se ajustan al monitor del visitante. No??
No recuerdo bien como era, pero si era eso voy a ponerme a investigar para solucionar un par de problemas.

Un saludo!
Se buscan colaboradores para comenzar con un foro de programación en general.

www.programarg.com
WWW
#3
En diseño responsivo por lo regular siempre se usan porcentajes, sólo se indican los pixeles en la media query, por ejemplo:

Código:
/* CSS general */
.main-wrapper {
   width:100%;
   display: block;
   height: 50px;
}

/* CSS responsive */
@media screen and (min-width: 820px) {
   .main-wrapper {
      background-color: red;
   }
}

/* CSS para monitores grantes*/
@media screen and (min-width: 1200px) {
   .main-wrapper {
      background-color: blue;
   }
}

@media screen and (device-width: 320px) and (device-height: 420px) {
   // CSS unicamente para dispositivos de 320x420px, por ejemplo
   .main-wrapper {
      background-color: yellow;
   }
}

Esto debería mostrar (no lo he probado Gran sonrisa) un rectángulo que cambie de color según las dimensiones. Checa estos enlaces (en inglés):

- CSS3 Media Queries
- CSS media queries: width versus device-width
WWW
#4
Exacto, en la media query solo tenes que indicar los px, en todo lo demas, se manejan en porcentajes.
[Imagen: infoenter.png]

Sitio de noticias y actualidad de la Región de la Costa Atlántica Argentina, el País y el Mundo.


Area comercial: [email protected]

Este sitio es alojado en el mejor Hosting - Skylium
#5
Siempre he tenido problemas con los responsives. ¿Cómo se podría hacer si para el "no responsive" quieres píxeles fijos, y para el responsive porcentajes?

Gracias
#6
Seep realmente usar Responsive necesitas mirarte el CSS3 propiedades del @media . Es lo que añadieron para que vaya cambiando la paginas dependiendo del tamaño de la pantalla . También entender como funciona el GRID y como se redistribuye los elementos.

Si te interesa un buen framework que tiene implementado los te recomiendo que mires Bootstrap !

http://getbootstrap.com/

saludos,
#7
para el responsive, se utiliza siempre % por que ya noes que se adapte a un pc, si no que tiene q adaptsrse a tablet y smartphone. tambien es interesante saber, que con los media queries, puedes configurar que a cierta resolución es decir un smartphone, no se muestre un siderbar o cualquier otra parte, que en pc o tablet si se vera..
saludos!
Metas En Skylium:
-Llegar a 30 mensajes []
-Llegar a 100 mensajes []
-Llegar a 250 mensajes []
-Conseguir 25 de reputación []



Posibles temas similares...
Tema Autor Respuestas Vistas Último mensaje
Sorprendido 2 tendencias en diseño web para 2019 [Ejemplos] WMasterT 7 245 Hace 7 horas
Último mensaje: cmascreativo.ml
  Plantillas HTML Responsive Free Profesionales gassip 16 935 13-06-2017, 03:45 AM
Último mensaje: gassip
  8 PREDICCIONES DE DISEÑO WEB 2017 Smithcanal 0 277 18-05-2017, 06:00 PM
Último mensaje: Smithcanal
  [Duda] Los mejores templates responsive larr86 1 300 02-12-2015, 06:13 PM
Último mensaje: Taquion
  Como poner 2 Div en la Misma Linea (Diseño Responsive) AngelKrak 2 1,316 13-02-2015, 08:01 AM
Último mensaje: Finer
  50 Herramientas de Diseño Web Gratis! [Parte 3] lukas 2 955 03-07-2013, 09:45 PM
Último mensaje: lukas
  50 Herramientas de Diseño Web Gratis! [Parte 1] lukas 2 669 18-06-2013, 10:59 PM
Último mensaje: fercol
  50 Herramientas de Diseño Web Gratis! [Parte 2] lukas 0 783 18-06-2013, 07:35 PM
Último mensaje: lukas
  Los 10 mandamientos del diseño web moderno joksan 8 788 03-05-2013, 07:37 PM
Último mensaje: Ideed
  [Duda] Diseño en HTML ilopezbdn 11 1,319 03-05-2013, 06:42 PM
Último mensaje: joksan



Usuarios navegando en este tema: 1 invitado(s)