HTMLpointHTMLpoint HTMLpoint.com


 Background y colores de fondo



En HTML clásico el fondo se imposta dentro de la marca <BODY> mediante los atributos bgcolor (para el color uniforme del fondo página) y background (para asignar al fondo una imagen gif o jpg). Los límites de estos instrumentos son evidentes sobre todo cuando es necesario insertar una imagen de fondo compleja. Existe un atributo de HTML que permite, sólo con MS Internet Explorer, fijar la imagen de fondo invocada como background:

<BODY background="sfondo.gif" bgproperties="fixed">

Como hemos dicho, es una solución que funciona sólo con el navegador Microsoft. Los usuarios Netscape no encontrarán ningún mensaje de error, sino tan sólo una página con el clásico fondo que se desliza junto con el resto del documento (existen algunos recursos para fijar los elementos de la página a pesar del scroller).

Las especificaciones de las CSS introducen, también por lo que se refiere a los colores de fondo, importantes novedades dirigidas sobre todo a liberar a los elaboradores de los vínculos operativos.
Esistono vari attributi per i colori e gli sfondi, ecco quali.

Atributo color
El atributo color define el color del texto del documento (no se debe confundir con el color de background) tanto mediante los nombres de los colores en inglés (black, silver, gray, white, maroon, red, purple, fuchsia, green, lime, olive, yellow, navy, blue, teal y aqua) como con tríos hexadecimales.
El formato RGB usa para definir los colores tres números enteros comprendidos entre 0 y 255, mediante una escala de valores lineal. El rojo es así, por tanto, 255,0,0 y los matices cromáticos se realizan a través de las combinaciones de colores.
En HTML los valores númericos de los colores se definen según el denominado "trío hexadecimal", o sea un conjunto de tres números y dos cifras hexadecimales.

<DIV STYLE="position:absolute; top:100px; left:100px; width:200px; color:blue">
HTMLpoint es el sitio italiano de web publishing más visitado y con mayor autoridad. Decenas de tutorial, centenares de Javascript, de applet Java, de demo para Dynamic HTML.
</DIV>


Muestra el ejemplo práctico


Atributo background-color
Este atributo determina el color de fondo de un determinado estilo. Su función es similar a la del clásico BODY de HTML, pero puede acercarse al color de fondo de las tablas. Se usa sobre todo para resaltar ciertas partes del documento.

<DIV STYLE="position:absolute; top:100px; left:100px; width:200px; background-color:blue">
HTMLpoint es el sitio italiano de web publishing más visitado y con mayor autoridad. Decenas de tutorial, centenares de Javascript, de applet Java, de demo para Dynamic HTML.
</DIV>


Muestra el ejemplo práctico


Atributo background-image
Tiene una función similar al background="image.gif" de HTML classico, invocando una imagen en formato GIF o JPG cargada en el fondo de la css

<DIV STYLE="position:absolute; top:100px; left:100px; width:200px; background-image: url(sfondo.jpg)">
HTMLpoint es el sitio italiano de web publishing más visitado y con mayor autoridad. Decenas de tutorial, centenares de Javascript, de applet Java, de demo para Dynamic HTML.
</DIV>


Muestra el ejemplo práctico


Atributo background-repeat
Este atributo permite repetir la imagen de fondo tal y como sucede con la marca BODY de HTML. Puede asumir distintos valores: repeat (la imagen se reduplica en vertical y horizontal), repeat-x (reduplica la imagen sólo en horizontal), repeat-y (reduplica la imagen sólo en vertical):

<DIV STYLE="position:absolute; top:100px; left:100px; width:400px; height:400px; background-image: url(sfondo.jpg); background-repeat: repeat-y">
HTMLpoint es el sitio italiano de web publishing más visitado y con mayor autoridad. Decenas de tutorial, centenares de Javascript, de applet Java, de demo para Dynamic HTML.
</DIV>


Muestra el ejemplo práctico


<DIV STYLE="position:absolute; top:100px; left:100px; width:400px; height:400px; background-image: url(sfondo.jpg); background-repeat: repeat-x">
HTMLpoint es el sitio italiano de web publishing más visitado y con mayor autoridad. Decenas de tutorial, centenares de Javascript, de applet Java, de demo para Dynamic HTML.
</DIV>


Muestra el ejemplo práctico


Atributo background-position
Las hojas de estilo permiten elegir un punto de inicio para la imagen de fondo distinto del clásico ángulo superior izquierdo. HTML clásico, de hecho, está impostado para que el fondo se visualice desde el punto extremo superior izquierdo. Con las CSS es posible usar algunas palabras clave para la colocación vertical (top, center y bottom) y horizontal (left, center y right). Si se expresan dos coordenadas,la primera es la horizontal y la segunda la vertical:

<DIV STYLE="position:absolute; top:100px; left:100px; width:400px; height:400px; background-image: url(sfondo.jpg); background-position: right top">
HTMLpoint es el sitio italiano de web publishing más visitado y con mayor autoridad. Decenas de tutorial, centenares de Javascript, de applet Java, de demo para Dynamic HTML.
</DIV>


Muestra el ejemplo práctico


Atributo background
Es un atributo que permite definir unívocamente los distintos atributos del fondo hasta ahora examinados. El orden que hay que seguir es el siguiente:

<DIV STYLE="position:absolute; top:100px; left:100px; width:400px; height:300px; background: yellow url(sfondo.jpg) repeat-y fixed right bottom">
HTMLpoint es el sitio italiano de web publishing más visitado y con mayor autoridad. Decenas de tutorial, centenares de Javascript, de applet Java, de demo para Dynamic HTML.
</DIV>


  Vuelve a principio de página