Foros del Web » Creando para Internet » CSS »

¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

Estas en el tema de ¿Cómo hace esta web para poner un fondo y que solo se repita el inicio? en el foro de CSS en Foros del Web. Hola chicos, mirad. Hablo de esta web: www.peliculasid.com Tiene esta imagen de fondo: http://img.peliculasid.com/imagenes/fondo.png Pero claro, sólo se repite una vez, para el título y ...
  #1 (permalink)  
Antiguo 08/04/2011, 05:55
 
Fecha de Ingreso: febrero-2011
Mensajes: 87
Antigüedad: 6 años, 9 meses
Puntos: 1
¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

Hola chicos, mirad.

Hablo de esta web: www.peliculasid.com

Tiene esta imagen de fondo: http://img.peliculasid.com/imagenes/fondo.png

Pero claro, sólo se repite una vez, para el título y demás, pero luego la tercera parte del fondo se hace infinito.

¿Cómo se hace esto, para crear un fondo en tres partes, pero tener el final infinito como en esa web?

Es que si yo hago un documento en blanco, y pongo esa imagen de fondo,se repite el fondo todo el rato, va saliendo el trozo negro de nuevo.

Un saludo y muchas gracias.
  #2 (permalink)  
Antiguo 08/04/2011, 06:38
Avatar de fishdesign  
Fecha de Ingreso: abril-2011
Ubicación: Málaga
Mensajes: 389
Antigüedad: 6 años, 8 meses
Puntos: 95
Respuesta: ¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

Se hace un repeat-y (horizontal) de esa imagen a lo largo de la pantalla.
Luego la parte de abajo, si te fijas es un color plano, así que en el body pones un background-color: color; de manera que se unirá la parte de arriba con todo el fondo del contenido.
Así que realmente eso que ves que se hace "infinito" no es más que el color de fondo de la web hecho en CSS.


La web tomará su ancho y finalmente hay otra capa para el footer, que es simplemente un div negro.


Un saludo
  #3 (permalink)  
Antiguo 08/04/2011, 07:32
 
Fecha de Ingreso: febrero-2011
Mensajes: 87
Antigüedad: 6 años, 9 meses
Puntos: 1
Respuesta: ¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

Cita:
Iniciado por fishdesign Ver Mensaje
Se hace un repeat-y (horizontal) de esa imagen a lo largo de la pantalla.
Luego la parte de abajo, si te fijas es un color plano, así que en el body pones un background-color: color; de manera que se unirá la parte de arriba con todo el fondo del contenido.
Así que realmente eso que ves que se hace "infinito" no es más que el color de fondo de la web hecho en CSS.


La web tomará su ancho y finalmente hay otra capa para el footer, que es simplemente un div negro.


Un saludo
Ostras, no lo sabía.

Entonces cómo hago para que sólo se repita de ancho?

Es que uso FrontPage, y no veo ninguna opción de esas
  #4 (permalink)  
Antiguo 08/04/2011, 08:14
Avatar de fishdesign  
Fecha de Ingreso: abril-2011
Ubicación: Málaga
Mensajes: 389
Antigüedad: 6 años, 8 meses
Puntos: 95
Respuesta: ¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

Disculpa, acabo de ver que en el anterior post puse repeat-y, pero la repetición horizontal es repeat-x

Lo puedes hacer con CSS.

.fondo{background: url(/images/fondo.png) repeat-x; height: 300px;}

Te recomiendo encarecidamente que no uses programas como FrontPage o Dreamweaver para maquetar mediante las opciones del programa. No acaba dando buenos resultados.

Es mejor leerte algun tutorial de html y css y escribirlo directamente. Es más fácil de lo que puede parecer en un principio.


Un saludo
  #5 (permalink)  
Antiguo 08/04/2011, 08:20
 
Fecha de Ingreso: febrero-2011
Mensajes: 87
Antigüedad: 6 años, 9 meses
Puntos: 1
Respuesta: ¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

Cita:
Iniciado por fishdesign Ver Mensaje
Disculpa, acabo de ver que en el anterior post puse repeat-y, pero la repetición horizontal es repeat-x

Lo puedes hacer con CSS.

.fondo{background: url(/images/fondo.png) repeat-x; height: 300px;}

Te recomiendo encarecidamente que no uses programas como FrontPage o Dreamweaver para maquetar mediante las opciones del programa. No acaba dando buenos resultados.

Es mejor leerte algun tutorial de html y css y escribirlo directamente. Es más fácil de lo que puede parecer en un principio.


Un saludo
Pero ese código lo añado dentro de una etiqueta que se llame

<style type="text/css">
</style>

o qué?

Es que tan solo necesito eso del fondo.

Un saludo y gracias por tu paciencia
  #6 (permalink)  
Antiguo 08/04/2011, 08:36
Avatar de fishdesign  
Fecha de Ingreso: abril-2011
Ubicación: Málaga
Mensajes: 389
Antigüedad: 6 años, 8 meses
Puntos: 95
Respuesta: ¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

Cita:
Iniciado por Kromikos Ver Mensaje
Pero ese código lo añado dentro de una etiqueta que se llame

<style type="text/css">
</style>

o qué?

Es que tan solo necesito eso del fondo.

Un saludo y gracias por tu paciencia
Si, ahí mismo.

Luego entre el <body></body> metes el
<div class="fondo">
//Aquí el contenido de la cabecera
</div>
  #7 (permalink)  
Antiguo 02/04/2013, 22:09
 
Fecha de Ingreso: marzo-2013
Ubicación: Paraguay
Mensajes: 11
Antigüedad: 4 años, 9 meses
Puntos: 0
Respuesta: ¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

como hago para que se repita la imagen de fondo de la cabecera y el footer?? solo eso.. como creo el css para mi pagina en html? y donde lo copio o como deberia de copiarlo?
  #8 (permalink)  
Antiguo 02/04/2013, 22:15
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 8 años, 10 meses
Puntos: 306
Respuesta: ¿Cómo hace esta web para poner un fondo y que solo se repita el inicio?

Hola 2bropy.
Es mejor que crees un nuevo tema, y que aclares mejor, y que muestres que tienes hasta el momento.
Sobre las preguntas que haces, creo que está claro más arriba.
www.librosweb.es busca el de introduccion a css.
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--

Etiquetas: fondo, inicio
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 00:30.