Foros del Web » Creando para Internet » CSS »

Dudas varias con esta maquetación

Estas en el tema de Dudas varias con esta maquetación en el foro de CSS en Foros del Web. Como estoy practicando CSS estoy haciendo muchos ejercicios de maquetación. Con el que estoy trabajando actualmente hay un asunto que no he sabido como abordarlo ...
  #1 (permalink)  
Antiguo 08/12/2010, 12:44
 
Fecha de Ingreso: diciembre-2010
Mensajes: 5
Antigüedad: 7 años
Puntos: 0
Pregunta Dudas varias con esta maquetación

Como estoy practicando CSS estoy haciendo muchos ejercicios de maquetación. Con el que estoy trabajando actualmente hay un asunto que no he sabido como abordarlo y me he visto obligado a ver la "solución" consultando el .css que ya venía. Recurro a vosotros para ver cómo lo haríais vosotros.

Por no haceros descargar el archivo, os lo explico lo más sencillo que pueda.

El theme en cuestión es este. La imagen representa una pequeña parte del mismo.



Bueno, mi problema viene al poner el fondo de la página. Al principio pensé que sería fácil pero la cosa se me complicó al ver el número de imágenes que la formaban. Como muestra la imagen, se compone de:

- Un degradado de colores a la izquierda y derecha del fondo principal. Por muy parecidos que creáis que son, ambos son totalmente distintos. Uno más oscuro que otro. Entonces, ya tenemos dos imágenes a utilizar, la del lado derecho y la del lazo izquierdo. (Podéis verlos en la imagen, donde pone "Degradado 1" y "Degradado 2").
- Una marquesina en el lado superior. Recorre la página completamente de derecha a izquierda.
- Por último, el fondo que veis en el centro, con las bolas de navidad y demás.

En resumen, ¿cuál es la forma? Un fondo centrado (el de las bolas de navidad), dos degradados a sus lados, y en la zona superior, una marquesina que ocupa todo el ancho. Entonces, como novato que soy todavía me cuesta ver cómo poner las capas por eso os pido consejo sobre cómo lo haríais vosotros.

Pero antes de nada, os pido también que opinéis sobre cómo lo hicieron los autores de la plantilla (me he mirado el .css y me he enterado más o menos). Os explico.

Primero, lo que ha hecho ha sido pone los degradados con posiciones absolutas justo debajo de la marquesina y los ha repetido horizontalmente hasta más o menos la mitad. Total, cuando se ponga el fondo no se va a notar nada la línea de unión entre ambos.

Lo siguiente que han puesto ha sido la marquesina de arriba. Sin ningún problema, repetida horizontalmente todo el ancho de la página.

Y por último han puesto el fondo de las bolas de navidad centrado.

Entonces, no sé si es buena idea haberlo hecho así. ¿Cómo lo hubierais hecho vosotros?

La siguiente duda viene con el logo de la web y el papa noel. He creado un <div> "header" que engloba, ambas imágenes, más el menú de navegación gris y los iconos chiquititos que se ven al lado del papa noel, que son una casa, una carte y otra cosita más. Entonces, tanto el logo como el papa noel los he colocado de forma absoluta dentro del <div> header. En principio está bien, me ha quedado igual pero es que hasta entonces en mis plantillas a penas he utilizado el position absolute y ahora lo estoy utilizando más que nunca. Me gustaría saber si es peligroso o no recomendable.

Y ya por último los mini iconitos de navegación, los de la casa, la carta y el otro que están al lado del papa noel. Entre ambos hay una imagen que es una línea de puntitos muy pequeña. Entonces, lo que he hecho ha sido:

<ul>
<li>Icono1</li><div class="separador"></div>
<li>Icono2</li><div class="separador"></div>
<li>Icono3</li>
</ul>

He utilizado las clases "separador" para poner la imagen. Me ha quedado bien pero claro, como no soy muy experto en esto, todo me parece que lo hago de forma chapucera, como si no fuera la correcta. Quiero que me digáis si está bien o mal.

Perdonad que os haya metido todo este tocho.
Para concluir:
1. ¿Cómo haríais el fondo?
2. Si he hecho mal al poner el logo de la web y la figura de papa noel con posiciones absolutas.
3. Si la forma de poner los separadores entre los iconos está bien.

¡Saludos!
  #2 (permalink)  
Antiguo 08/12/2010, 18:52
 
Fecha de Ingreso: diciembre-2010
Ubicación: en el fin del mundo
Mensajes: 199
Antigüedad: 7 años
Puntos: 3
Respuesta: Dudas varias con esta maquetación

deberias de guardar el fondo totalmente entero en una sola imagen para que la pongas como background de body.

Otra manera es que guardes las imagenes por separado (la de con menos degradado la de con mas degradado) y las apliques dentro de un div como background e inicies a posicionar los divs relativamente y con un tamaño definido, que seria mas rollo :S

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 06:20.