Página 1 de 11
Moderador del foro: ZorG 
Foro uCoz » Ayuda a los webmasters » Configuración del diseño » Fondo del documento
Fondo del documento
GUARAGUAO
Mensajes: 2362
Reputación: 81
Mensaje Nº 1 | 6:34 PM
Propiamente, el fondo se cambia a la página, celdas de la tabla y toda la tabla.

Entonces, para cambiar el fondo de toda la página hay que encontrar el tag <body>, luego elegir el color requerido y añadir lo siguiente al tag body:

Code
<body bgcolor="Número de color">

Por ejemplo:

Code
<body bgcolor="#008000">

Pero si quieres aplicar una imagen en calidad del fondo, de nuevo tienes que encontrar el tag <body>, encontrar una imagen conveniente, subirla al servidor y al tag <body> añadir lo siguiente:

Code
<body background="enlace al archivo">

Por ejemplo:

Code
<body background="http://www.ucoz.com/image/1.jpg">

Cuando una imagen se utiliza como el fondo, existe un método pequeño llamado “sustrato” del fondo (fijación) para fijar el fondo tendrás que al tag <body> añadir lo siguiente:

Code
bgproperties="fixed"

Por ejemplo:

Code
<body background="http://www.ucoz.com/image/1.jpg" bgproperties="fixed">

Ahora las tablas.

Como ejemplo tomamos una tabla simple 3х3.

Code
<table border="1" cellpadding="0" cellspacing="0" width="100%">
   <tr>
    <td width="33%">Datos</td>
    <td width="33%"> Datos</td>
    <td width="34%"> Datos</td>
   </tr>
   <tr>
    <td width="33%"> Datos</td>
    <td width="33%"> Datos</td>
    <td width="34%"> Datos</td>
   </tr>
   <tr>
    <td width="33%"> Datos</td>
    <td width="33%"> Datos</td>
    <td width="34%"> Datos</td>
   </tr>
</table>

He aquí nuestra tabla. De repente queremos modificar la celda 2.3 (2 – línea, 3 – celda). Es muy fácil: buscamos la celda 2.3, como estamos enterados las líneas se designan por los tags <tr> y las celdas –<td>, entonces nuestra tabla tiene 3 pares <tr></tr> y 9 pares <td><td>. Mirando el código con toda seguridad podemos decir que tenemos 3 líneas, cada cual tiene 3 celdas, si queremos modificar 2.3 – entonces omitimos el primer par <tr></tr> y 3 pares <td><td> y pasamos al segundo par <tr></tr> donde hacemos las modificaciones. He aquí nuestro segundo par:

Code
<tr>
    <td width="33%"> Datos</td>
    <td width="33%"> Datos</td>
    <td width="34%"> Datos</td>
   </tr>

tomamos la tercera celda (<td width="34%"> Datos</td>) y cambiamos aquí el fondo igualmente como en body. Elegimos el color y añadimos en nuestra celda:

Code
bgcolor="#FF0000"

Ejemplo:

Code
<td width="34%" bgcolor="#FF0000"> Datos</td>

Lo mismo se hace si queremos una imagen en vez del color:

Code
<td width="34%" background="enlace al archivo"> Datos</td>

Ejemplo:

Code
<td width="34%" background="http://www.ucoz.com/image/1.jpg"> Datos</td>

Pero si queremos cambiar el color de toda la tabla de una vez, hacemos lo siguiente: encontramos nuestra tabla

Code
<table border="1" cellpadding="0" cellspacing="0" width="100%">
   <tr>
    <td width="33%">Datos</td>
    <td width="33%"> Datos</td>
    <td width="34%"> Datos</td>
   </tr>
   <tr>
    <td width="33%"> Datos</td>
    <td width="33%"> Datos</td>
    <td width="34%"> Datos</td>
   </tr>
   <tr>
    <td width="33%"> Datos</td>
    <td width="33%"> Datos</td>
    <td width="34%"> Datos</td>
   </tr>
</table>

y en tag <table> añadimos

Code
bgcolor="#008000"

Ejemplo:

Code
<table border="1" cellpadding="0" cellspacing="0" width="100%" bgcolor="#008000">

Para poner una imagen en calidad del fondo, la forma es igual a lo expuesto arriba...

Code
<table border="1" cellpadding="0" cellspacing="0" width="100%" background="http://www.ucoz.com/image/1.jpg">

Las vírgenes tienen muchas navidades pero ninguna Nochebuena.
GUARAGUAO
Mensajes: 2362
Reputación: 81
Mensaje Nº 2 | 12:36 PM
Cambio del color mediante CSS

Para cambiar el color de nuestro documento elegimos el elemento body y las propiedades background-color, y claro está, el respectivo número del color.

Code
body {background-color: #999;}

Color y fondo del elemento

Con ayuda del lenguaje CSS se puede configurar el color y el fondo para cada elemento aparte. Simplemente hay que elegir un elemento y crear una regla.

Por ejemplo: elemento h1

Code
body {background-color: #999;}
h1 {background-color: #ccc;}

o elementos а y р:

Code
body {background-color: #999;} h1 {background-color: #ccc;}
p {background-color: #fff;}
a {background-color: #ccc;}

también se puede aplicar una imagen en calidad del fondo:

Code
body {background-image: url(ucoz.jpg);}

Aplicación de los propios selectores.

Hasta ahora hemos utilizado los selectores de los elementos que directamente pertenecen a un cierto elemento del lenguaje HTML, tales como: H1 p a.

Ahora tomemos los selectores de clase.
Selectores de clase son los selectores personalizados cuyos nombres eliges tú; ante el nombre se pone un punto, por ejemplo – .ucoz (En una definición o una regla para las hojas de estilo CSS, es un subconjunto de un selector que controla si es posible utilizar el mismo selector para estilos ligeramente diferentes en situaciones diferentes.)

Los clanes se aplican al lenguaje HTML mediante el atributo class. Por ejemplo:

Code
tr class="ucoz">...</tr>

Relleno del fondo en eje horizontal y vertical.

Eje horizontal o eje x permite rellenar el fondo sólo en horizontal.

Code
body {background-image: url(test.jpg); background-repeat: repeat-x;}

respectivamente, el eje y:

Code
body {background-image: url(test.jpg); background-repeat: repeat-y;}

Las vírgenes tienen muchas navidades pero ninguna Nochebuena.
joseromero
Mensajes: 18
Reputación: 0
Mensaje Nº 3 | 1:39 AM
Je ando por aqui buscado como puedo ponerle una imagen de fondo solo al foro?
gracias desde ya.
ViTs
Mensajes: 31
Reputación: 0
Mensaje Nº 4 | 11:49 PM
entra en el apartado foro y haz lo mismo que explica guaraguao con lo del fondo en toda la pagina...

P.D.:tendras que entrra en gestio de diseño claro esta....

Añadido (2009-10-14, 11:37 Pm)
---------------------------------------------
y yo por ejemplo tengo esto:::

<body style="background:000000; margin:0px; padding:0px;">

para poner en vez de ese color negro(000000) quiero poner una foto (con una direccion)
cambio esos 6 numeros por la direccion d ela foto pero nada.....el fondo se pone en blanco...que hago?????como lo cambio???? paraque en vez de que sea fondo negro sea la foto que yo quiero...??

Añadido (2009-10-14, 11:49 Pm)
---------------------------------------------
sorry,ya lo e resuelto,era mas facil de lo que pensaba....=))

Kyosuke
Mensajes: 3
Reputación: 0
Mensaje Nº 5 | 3:23 AM

  • - Como o donde pongo el codigo para la imagen del fondo de la pag en general.
  • * Lo pongo en cualquier lado XD pero lo unico que me sale es el color de fondo
  • - Si la imagen es mas pequeña, esta se repetira?
Circuits
Mensajes: 14
Reputación: 0
Mensaje Nº 6 | 2:36 AM
hola!!!! de primeras agredecer a ucoz y a este foro por el servicio prestado, tengo un problema... cada vez que quiero modificar el fondo en css cambia toda la webbb, porque???? www.contundent.ucoz.com, de antemano gracias
Yukino
Mensajes: 2
Reputación: 0
Mensaje Nº 7 | 5:24 PM
HoOlas! muy buena la explicación =D
ya me di cuenta lo confundida que estaba xD
ahora sip a ponerlo en practica
aunque yo estoy queriendo aplicar un diseño de fondo
me parece que si se puede remplazar el estilo o modelo que se escogio por defecto...
de todas formas este foro es una gran ayuda
gracias por el tiempo de postear estas explicaciones....salu2! smile
defaultNick2226
Mensajes: 12
Reputación: 0
Mensaje Nº 8 | 5:37 PM
Hola aqui hay algo que no funciona amigo Guaraguao y es que a la hora de poner la imagen de fondo digamos que este comando va bien pero la imagen se ve en mosaico osea el fondo no esta fijo y se ve la imagen varias veces repetidas y aunque la cambies para tu monitor no estara vista para los demas usuarios

Code
<body background="enlace al archivo">

por lo cual pasamos al siguiente comando el cual dice o eso creo que es para fijar la imagen y que no se repita , solo esa imagen de fondo para toda la web,pero no funciona sigue viendose igual que en el apartado anterior, e probado a poner el tamaño WIDTH="" HEIGHT="" al 100% o simplemente con cifras mas altas peron o cambia absolutamente nada

Code
<body background="http://www.ucoz.com/image/1.jpg" bgproperties="fixed">

solucion funcional por favor ,,, un saludo
Foro uCoz » Ayuda a los webmasters » Configuración del diseño » Fondo del documento
Página 1 de 11
Búscar: