Hojas de Estilo: CSS

Hojas de estilo: CSS
Con la intención de separar el contenido de la presentación y de ofrecer mayores y más

fáciles posibilidades de presentación el W3 Consortium sugirió la utilización de las Hojas
de Estilo (CSS, Cascade Style Sheet) en la Web. En la actualidad las especificaciones
CSS se encuentran en el nivel 2, aunque las del nivel 1 (CSS1)son las más soportadas.
1. Sintaxis CSS
Una hoja de estilo está formada de un conjunto de reglas de estilo que le dice al
navegador como presentar un documento. Cada regla de estilo consta de dos partes:
Selector { propiedad: valor;... }
1. Selector. Representa una etiqueta estándar del HTML.
2. Declaración. Viene definido por un par propiedad:valor separados entre si por

dos puntos. En propiedad indicamos que caracterı́stica (tipo de fuente, color, etc...)
queremos cambiar y en valor el valor que le damos.
H1 { color: blue }
Para no repetir reglas que se aplican sobre las mismas etiquetas se pueden agrupar los
selectores. Por ejemplo, todas las cabeceras van a tener el mismo color:
H1, H2, H3, H4, H5, H6 { color: blue }
También se pueden añadir comentarios dentro de los ficheros css de la siguiente manera:
/* COMMENTS CANNOT BE NESTED */
1.1. Definición
Hay tres maneras de definir los estilos:
1. Se pueden declarar directamente sobre la etiqueta HTML:
<ETIQUETA style="propiedad:valor;....">... </ETIQUETA>
Hojas de estilo:CSS 1
Sistemas Hipermedia: Diseño y Evaluación
Por ejemplo si a un párrafo le queremos dar un tamaño de fuente 10 y un margen
izquierdo de 20 pts.
<P STYLE="font-size:10pt; margin-left:20pt;">
Mi Primer párrafo con Estilo
</P>
2. Se pueden definir en su conjunto para toda la página HTML:
<STYLE TYPE="text/css">
<!-
......
etiqueta {propiedad:valor; .........}
......
-->
</STYLE>
Un ejemplo serı́a:
<HTML>
<HEAD>
<TITLE>Ejemplo CSS</TITLE>
<STYLE TYPE="text/css">
<!-
BODY {margin-left: 0.5in; margin-right: 0.5in}
H1 {color:blue;}
P {font-size:10pt; marginleft:20pt;}
-->
</STYLE>
</HEAD>
<BODY>
<H1>Titulo en azul</H1>
<P>Párrafo con letra 10</P>
</BODY>
</HTML>
3. Se pude especificar en un fichero externo. Esta manera es la más flexible y recomen-

dada, ya que el estilo asociado a una página HTML se puede cambiar sin modificar
el código de dicha página y además la misma hoja de estilo se puede compartir
con diferentes documentos. Para enlazar la hoja de estilo con una página HTML se
puede utilizar la etiqueta LINK:
<HTML>
<HEAD>
<LINK rel="stylesheet" type="text/css" href="hoja_estilos.css">
</HEAD>
......
</HTML>
El fichero hoja estilos.css es un simple fichero de texto con extensión .css en el que
se define la hoja de estilo.
/*Fichero hoja_estilos.css*/
BODY {margin-left: 0.5in; margin-right: 0.5in}
H1 {color:blue;}
P {font-size:10pt; marginleft:20pt;}
/*Fin del fichero hoja_estilo.css*/
1.2. Orden de aplicación

Estos tres modos de definir estilos pueden convivir en la misma página html, pero si
sobre un mismo elemento se han definido diferentes estilos, sólo se aplicará uno de ellos
de acuerdo a las siguientes reglas, ordenadas de menor a mayor prioridad:
1. Las definidas por el navegador
2. Hoja de estilo externa
3. Hoja de estilo interna (dentro de la etiqueta ¡head¿)
4. Directamente sobre la etiqueta HTML
Por ejemplo, una hoja de estilo externa tiene las siguientes propiedades para el selector
h3:
h3
{
color: red;
text-align: left;
font-size: 8pt
}
Y una hoja de estilo externa tiene estas propiedades también para el selector h3:
h3
{
text-align: right;
font-size: 20pt
}
Si la página con la hoja de estilo interna también está enlazada con la hoja de estilo
externa, las propiedades para h3 serı́an:
color: red;
text-align: right;
font-size: 20pt
El color es heredado desde la hoja de estilo externa, y el text-alignment y el font-size son

reemplazados por las de la hoja de estilo interna.
2. Propiedades de las hojas de estilo

Las propiedades están divididas en 6 grandes grupos que facilitan su utilización y
documentación.
2.1. Propiedades de texto
Son propiedades que afectan a la presentación visual de caracteres, espacios, palabras
y párrafos. Las propiedades que podemos utilizar son las siguientes:
color. Especificamos el color del primer plano del contenido del texto.
Nombre Color | Valor HEX | Rgb (R %,G %,B %) | Rgb(R, G,B)
Ejemplo:
H1{color:red}
text-transform. Especifica, por medio de palabras reservadas, si las letras del

texto deben transformarse en mayúsculas, minúsculas, sólo la primera letra de cada
palabra en mayúsculas, o si ha de dejarse como está.
uppercase | lowercase | capitalize | none
Ejemplo:
H1 {text-transform:uppercase}
vertical-align. Alineación vertical del texto en relación con la lı́nea base del texto.
baseline | sub | super | top | text-top | middle | mottom | text-bottom
Ejemplo:
STRONG {vertical-align:sub}
text-align. Fija la alineación del bloque, al margen izquierdo, al derecho, centrado

o a ambos.
left | right | center | justify
Ejemplo:
H1{text-align: center}
text-indent. Fija la sangrı́a o indentación de la primera lı́nea del texto.
XX unidad | %
Ejemplo:
P {text-indent:2em}
line-height. Indica la distancia entre dos lineas adyacentes.
normal | XX unidad | %
text-decoration. Fija una o más caracterı́sticas ”decorativas”del texto, como subra-

yado, lineas superiores, caracteres tachados o parpadeantes. Si se aplica a un ele-
mento de bloque la heredan sólo los descendientes que sean de texto (o en-linea). Si
se aplica a uno de éstos la heredan todos los descendientes.
underline | overline | line-through | blink | none
Ejemplo:
H1 {text-decoration: underline}
letter-spacing. Especifica el espaciado entre letras. En el caso de especificar una

longitud esta se sumara a la normal.
normal | XX unidad
Ejemplo:
H1{letter-spacing: 0.5pc}
word-spacing. Especifican el espaciado entre palabras. En el caso de especificar

una longitud esta se sumara a la normal.
normal | XX unidad
Ejemplo:
H1 { word-spacing: 0.5pc}
2.2. Propiedades de las fuentes
Con estas propiedades controlamos el estilo de una fuente, su tamaño, su familia, su
grosor, etc. Las propiedades que podemos utilizar son las siguientes:
font-family.Indicamos la familia de la fuente a utilizar. Sus posibles valores son los

nombres de las fuentes, pudiendo especificar un conjunto de familias. Se selecciona
la primera que se encuentra en el sistema.
Ejemplo:
BODY{
font-family: Verdana, Arial, Helvetica, sans-serif}
font-style. Especifica el estilo de la fuente, es decir, si los caracteres irán en normal,

en itálica (cursiva) o en oblicua (un poco más inclinada que la itálica).
normal | italic | oblique
Ejemplo:
H1,H2,H3{font-style:italic}
font-weight.Especifica el peso, densidad o grosor (cantidad de espacio ocupado en

relación con el rectángulo en que se inscribe el carácter) de la fuente de caracteres
dentro de una familia de fuentes, con valores entre 100 y 900 siendo cada vez más
densos. El valor 400 equivale a normal, y el 700 a bold.
lighter | normal | bold | bolder | 100 | 200 | 300 | ...... | 900
Ejemplo:
STRONG{font-weight:bolder}
font-size. Especifica el tamaño de la fuente.
XX units | % | larger | smaller | xx-small | x-small | medium | large |

x-large | xx-large
Ejemplo:
H1 {font-size: 150%}
2.3. Propiedades del fondo

Son las propiedades que permiten fijar el color del primer plano y fondo de un elemento.
Las propiedades que podemos utilizar son las siguientes:
background-color. Especifica el color del fondo del elemento, que puede ser un
color o la palabra reservada transparent.
transparent | Nombre Color | Valor HEX | Rgb (R %,g %,B %) | Rgb(R,

G,B)
Ejemplo:
H1{background-color:#0000FF}
background-image. Designa una imagen para rellenar el fondo del elemento por
medio de una URL o la palabra reservada none para indicar que no se utilizara
ninguna imagen. Puede fijarse también un color que se colocará debajo de la imagen,
y que asomará si la imagen no está disponible o, si lo está, detrás de sus zonas
transparentes.
none | url(dirección)
Ejemplo:
H1 {background-image: white url("fondo.gif")}
background-attachment. Establece si una imagen de fondo es fija o se mueve con

el scroll del resto de la página. Sólo funciona con la etiqueta body.
scroll | fixed
Ejemplo:
body
{
background-image: url(fondo.gif);
background-attachment: scroll
}
background-repeat. Establece si una imagen si se repetirá y cómo. En Netscape

no funciona con la etiqueta body.
repeat | repeat-x | repeat-y | no-repeat
Ejemplo:
body
{
background-image: url(fondo.gif);
background-attachment: scroll
}
2.4. Propiedades de margenes y padding
Con estas propiedades especificamos los margenes de cualquier elemento y con el pad-
ding controlamos la distancia entre el borde y el contenido. Las propiedades que podemos
utilizar son las siguientes:
margin-top, margin-bottom, margin-left, margin-right. Fijamos el margen

superior, inferior, izquierdo o derecho. Con la propiedad auto el navegador un valor
adecuado dependiendo del tipo de elemento.
XX unidades | % | auto (el valor por defecto es 0)
Ejemplo:
BODY {margin-top:1cm}
margin.Mediante esta propiedad podemos especificar todos los valores de los mar-
genes de una sola vez. Se pueden poner hasta cuatro valores, para especificar cada
uno de los margenes.
margin: ancho1 ancho2 ancho3 ancho4
Pero si sólo especificamos ancho1 se refiere a los cuatro lados del margen. Si se
especifican dos valores, ancho1 se refiere a los lados superior e inferior y ancho2 al
izquierdo y derecho. En el caso de poner los tres primeros, ancho1 se refiere al lado
superior, ancho2 al izquierdo y derecho y ancho3 al inferior.
Ejemplo:
BODY {margin: 1in 2in}
padding-top, padding-bottom, padding-left, padding-right. Distancia entre

el borde superior, inferior, izquierdo o derecho y el contenido.
XX unidades | %
Ejemplo:
Table {padding-top: 12pt}
padding. Mediante esta propiedad podemos definir en una única propiedad los
cuatro valores anteriores. Funciona de la misma manera que la propiedad margin.
margin: ancho1 ancho2 ancho3 ancho4
Ejemplo:
H1 {padding:10%}
2.5. Propiedades del borde

Con estas propiedades especificamos el ancho, color y estilo del área de borde. Las
propiedades que podemos utilizar son las siguientes:
border-top-width, border-bottom-width, border-left-width, border-right-

width. Mediante estas cuatro propiedades especificamos el ancho del área de borde
por encima, debajo, a la izquierda y derecha del elemento.
thin | medium | thick | XX unidad
Ejemplo:
H1 {border-top-width:thin}
border-width. Especificamos en una única propiedad el ancho de todo el área de

borde. Funciona de la misma manera que la propiedad margin.
thin | medium | thick | XX unidad
Ejemplo:
H1 { border-width: thin thick medium}
border-style. Especificamos el estilo de visualización del borde. Los posibles valores

son:
• none: ninguno, anchura cero

• dottet: punteado
• dashed: discontinuo
• solid: liso
• double: doble
• groove: hundido
• ridge: resaltado
• inset: toda la caja hundida
• outset: toda la caja resaltada
none | dottet | dashed | solid | double | groove | ridge | inset | outset
Ejemplo:
Table {border-style: double}
border-color. Especificamos el color del borde.
nombre del color | valor HEX | Rgb (R %, G %, B %) | Rgb (R,G,B)
Ejemplo:
Table {border-color: red}
border-top, border-bottom, border-left, border-right. En cada una de las

cuatro propiedades podemos especificar en conjunto todas las caracterı́sticas de
cada uno de los lados del borde: tamaño, estilo y color.
anchura | estilo | color
Ejemplo:
Table {border-top: thin dashed red}
border. Mediante esta propiedad podemos especificar de forma conjunta todas las
propiedades de un borde: tamaño, estilo y color.
anchura | estilo | color
Ejemplo:
Table {border: thick double red}
2.6. Propiedades de lista

Son propiedades que afectan a la presentación visual de las marcas de los elementos
de una lista. Las propiedades que podemos utilizar son las siguientes:
list-style-image. Reemplaza el marcador de los elementos de una lista por una

imagen.
url () | none
Ejemplo:
ol
{
list-style-image: url(blueball.gif);
}
list-style-type. Define el tipo de marcador de los elementos de una lista. Algunos

navegadores sólo soportan el valor disc.
none | disc | circle | square | decimal | lower-roman | upper-roman |
lower-alpha | upper-alpha
Ejemplo:
ul
{
list-style-type: disc
}
list-style-position. Define si el marcador se situa como parte del texto o lo man-

tiene a la izquierda del texto.
inside | outside
Ejemplo:
ol
{
list-style-position: inside
}
3. Selectores avanzados:Class e ID
Estos tipos de selectores permiten la asignación de estilos de una manera independiente
de los elementos del documento. Estos selectores pueden ser usados sólos o en conjunción
con etiquetas.
El selector Class necesita una modificación en el documento html donde se va a

aplicar, es decir las etiquetas necesitan el atributo CLASS:
<P CLASS="importante">NOTA: Es necesario incluir el atributo CLASS </P>
<H3 CLASS="importante">
En la hoja de estilo se debe añadir:
.importante {color:red;}
El . indica que es un selector class. Si queremos añadir clases a etiquetas concretas,

serı́a de la siguiente manera:
P.importancia{color:red;}
Los selectores ID son diferentees a los selectores class. Mientras que un selector class
puede ser aplicado a diferentes elementos en una página, un serlector id siempre se
aplica a un único elemento. Un atributo ID debe ser único en el documento. Además
su sintaxis es diferente, van precedidos de un #.
#importancia{color:red;}
p#para1
{
text-align: center;
color: red
}
Para aplicarlos sobre una etiqueta es decesario el atributo ID.
<P ID="importante">NOTA: Es necesario incluir el atributo CLASS </P>
La diferencia entre estos dos tipos de selectores es que Class puede ser usado varias
veces en el mismo documento mientras que el selector ID solamente puede ser aplicado
una y sólo una vez.
4. Pseudo-Clases y Pseudo-Elementos
Son clases y elementos especiales que son automáticamente reconocidos por los navega-
dores que soportan CSS. Las pseudo-clases distinguen entre diferentes tipos de elementos
(por ejemplo, enlaces visitados o activos). Los pseudo-elementos se refieren a subpartes
de los elementos como la primera letra de un párrafo. Las reglas con pseudo-clases tienen
la siguiente sintaxis:
selector:pseudo-clase { propiedad: valor }
selector:pseudo-elemento { propiedad: valor }
Estos selectores no se deberı́an especificar con el atributo CLASS de HTML. Se pueden

usar también con selectores clases:
selector.clase:pseudo-clase { propiedad: valor }
selector.clase:pseudo-elemento { propiedad: valor }
4.1. Pseudo-clases del ancla

En CSS1 sólo hay tres pseudo-clases y son asignadas al elemento A para mostrar de
diferente manera los enlaces no visitados, los activos, los visitados y cuando el ratón pasa
sobre un enlace.
A:link { color: red }
A:active { color: blue; font-size: 125% }
A:visited { color: green; font-size: 85% }
A:hover {}
4.2. Pseudo-elemento primera lı́nea

Permite cambiar el estilo a la primera lı́nea de un elemento de nivel de bloque como
puede ser el párrafo. Un ejemplo podrı́a ser:
P:first-line {
font-variant: small-caps;
font-weight: bold }
4.3. Pseudo-element primera letra

Este pseudo-elemento es utilizado para cambiar el estilo de la primera letra de un
elemento de nivel de bloque. Por ejemplo:
P:first-letter { font-size: 300%; float: left }
5. Unidades de longitud
Un valor de longitud se forma por un signo + o - opcional, seguido de un número y
de una abreviación de dos letras que indica la unidad. No hay espacios en un valor de
longitud (1.3em). Una longitud de 0 no necesita las dos letras para identificar la unidad.
5.1. Relativas
Las unidades relativas dan una longitud relativa a otra propiedad longitud. Las si-
guientes unidades relativas están disponibles:
em (ems, la altura de la fuente de los elementos)
ex (x-height, altura de la letra ”x”)
px (pixels, relativa a la resolución del lienzo)
5.2. Absolutas
Las unidades de longitud absolutas son muy dependientes del medio de salida, y son
por lo tanto menos útiles que las unidades relativas. Las siguientes unidades absolutas
están disponibles:
in (pulgadas; 1 pulgada=2.54 cm)
cm (centı́metros; 1 cm = 10 mm)
mm (milı́metros)
pt (puntos; 1pt = 1/72 pulgada)
pc (picas; 1 pc = 12 pt)
6. CSS Avanzado
6.1. Selector universal
El selector universal se escribe con un asterisco (*) y representa a cualquier elemento
de la página. Por ejemplo, con:
* {color: red}
Todos los elementos de la página tendrán como color de primer plano el rojo
6.2. La regla @import
La regla @import permite importar hojas de estilo desde otras hojas de estilo. Se
puede usar de las siguientes formas:
@import "hoja_de_estilo.css";
@import url("hoja_de_estilo.css");
Esta declaración debe ir antes que cualquier otra regla en la hoja de estilo.
6.3. La regla !important

la regla !important, suplantar con sus propias reglas de estilo las especificadas por el
autor del documento.
De este modo, los usuarios con requerimientos especı́ficos pueden modificar las opciones
del creador de las páginas Web con el fin de mejorar su accesibilidad.
Los navegadores tienen opciones que permiten modificar la apariencia de las páginas
visitadas. Estas opciones constituyen de hecho la hoja de estilo del usuario. Explorer,
además de las opciones disponibles en los menúes, permite usar una hoja de estilo externa.
De este modo, el usuario obtiene la máxima flexibilidad para aplicar sus preferencias.
Probar la siguiente hoja de estilo:
* { visibility: hidden !important;}

BODY { visibility: visible !important;
background-color: black !important;
background-image: url(borrando.gif) !important;
background-repeat: no-repeat !important;
background-position: 200px 120px !important;}
Depués, editar las Propiedades de Internet de Explorer y en la opción General-Accesibilidad

indicar la posición de su hoja de estilo.
6.4. Propiedad del cursor

Especifica el tipo de cursos que será mostrado cuando se señale un elemento.
url() | default | auto | crosshair | default | pointer | move | e-resize | ne-resize

| nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait |
help
Ejemplo:
h2
{
cursor: crosshair
}
p
{
cursor : url("first.cur"), url("second.cur"), pointer
}
6.5. Propiedades de posicionamiento

Estas propiedades permiten especificar, de manera relativa o absoluta la posición de
un elemento, su forma y especifcar lo que deberı́a pasar si el contenido de un elemento es
más grande que el area especifcada.
position. Sitúa un elemento en su posición normal, en una posición relativa con

respecto al elemento anterior o en cualquier posición fija de la página.
auto | relative | absolute
Ejemplo:
h1
{
position:absolute;
top:150px;
}
top. Especifica la situación del borde superior de un elemento.
auto | % | unidad
Ejemplo:
h1
{
position:absolute;
top:150px;
}
bottom. Especifica la situación del borde inferior de un elemento.
auto | % | unidad
Ejemplo:
h1
{
position:absolute;
bottom:150px;
left. Especifica la situación del borde izquierdo de un elemento.
auto | % | unidad
Ejemplo:
h1
{
position:absolute;
top:150px;
left:30px;
}
right. Especifica la situación del borde derecho de un elemento.
auto | % | unidad
Ejemplo:
h1
{
position:absolute;
top:150px;
right:30px;
}
clip. Especifica la forma de un elemento.
rect (top, right, bottom, left) | auto
Ejemplo:
img
{
clip: rect(10px, 5px, 10px, 5px)
}
overflow. Especifica qué sucede cuando el contenido de un elemento es mayor que

el área de visualización.
visible | hidden | scroll | auto
Ejemplo:
div
{
background-color:#00FFFF;
width:150px;
height:150px;
overflow: scroll
}
z-index. Indica el orden de superposición de los elementos en el caso de que coin-
cidan en el mismo espacio. Un elemento con un número más alto siempre se posi-
cionará encima de un elemento con menor número.
auto | entero
Ejemplo:
img.x
{
position:absolute;
left:0px;
top:0px;
z-index:1
}
7. Bibliografı́a
HTML dinámico http://html.programacion.net/dinamico/tutorial/indice.htm
CSS Cascading Style Sheets, level 1 http://www.w3.org/TR/REC-CSS1
CSS Cascading Style Sheets, level 2 http://www.w3.org/TR/REC-CSS2/
Listado de propiedades soportadas por los navegadores http://www.webreview.com/style/
Traducción de la especificación CSS2: http://www.sidar.org/recur/desdi/traduc/es/css/cover.html

Hojas de Estilo: CSS

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Hojas de Estilo: CSS

Transféré par

Droits d'auteur :

Formats disponibles

Hojas de estilo: CSS

Con la intención de separar el contenido de la presentación y de ofrecer mayores y más

Selector { propiedad: valor;... }

1. Selector. Representa una etiqueta estándar del HTML.

2. Declaración. Viene definido por un par propiedad:valor separados entre si por

H1, H2, H3, H4, H5, H6 { color: blue }

/* COMMENTS CANNOT BE NESTED */

1. Se pueden declarar directamente sobre la etiqueta HTML:

<ETIQUETA style="propiedad:valor;....">... </ETIQUETA>

<P STYLE="font-size:10pt; margin-left:20pt;">

Mi Primer párrafo con Estilo

2. Se pueden definir en su conjunto para toda la página HTML:

etiqueta {propiedad:valor; .........}

BODY {margin-left: 0.5in; margin-right: 0.5in}

<P>Párrafo con letra 10</P>

3. Se pude especificar en un fichero externo. Esta manera es la más flexible y recomen-

<LINK rel="stylesheet" type="text/css" href="hoja_estilos.css">

BODY {margin-left: 0.5in; margin-right: 0.5in}

/*Fin del fichero hoja_estilo.css*/

1.2. Orden de aplicación

1. Las definidas por el navegador

3. Hoja de estilo interna (dentro de la etiqueta ¡head¿)

4. Directamente sobre la etiqueta HTML

El color es heredado desde la hoja de estilo externa, y el text-alignment y el font-size son

2. Propiedades de las hojas de estilo

Nombre Color | Valor HEX | Rgb (R %,G %,B %) | Rgb(R, G,B)

text-transform. Especifica, por medio de palabras reservadas, si las letras del

uppercase | lowercase | capitalize | none

baseline | sub | super | top | text-top | middle | mottom | text-bottom

text-align. Fija la alineación del bloque, al margen izquierdo, al derecho, centrado

left | right | center | justify

text-indent. Fija la sangrı́a o indentación de la primera lı́nea del texto.

line-height. Indica la distancia entre dos lineas adyacentes.

text-decoration. Fija una o más caracterı́sticas ”decorativas”del texto, como subra-

underline | overline | line-through | blink | none

letter-spacing. Especifica el espaciado entre letras. En el caso de especificar una

word-spacing. Especifican el espaciado entre palabras. En el caso de especificar

font-family.Indicamos la familia de la fuente a utilizar. Sus posibles valores son los

font-family: Verdana, Arial, Helvetica, sans-serif}

font-style. Especifica el estilo de la fuente, es decir, si los caracteres irán en normal,

normal | italic | oblique

font-weight.Especifica el peso, densidad o grosor (cantidad de espacio ocupado en

lighter | normal | bold | bolder | 100 | 200 | 300 | ...... | 900

font-size. Especifica el tamaño de la fuente.

XX units | % | larger | smaller | xx-small | x-small | medium | large |

2.3. Propiedades del fondo

transparent | Nombre Color | Valor HEX | Rgb (R %,g %,B %) | Rgb(R,

H1 {background-image: white url("fondo.gif")}

background-attachment. Establece si una imagen de fondo es fija o se mueve con

background-repeat. Establece si una imagen si se repetirá y cómo. En Netscape

repeat | repeat-x | repeat-y | no-repeat

margin-top, margin-bottom, margin-left, margin-right. Fijamos el margen

XX unidades | % | auto (el valor por defecto es 0)

margin: ancho1 ancho2 ancho3 ancho4

BODY {margin: 1in 2in}

padding-top, padding-bottom, padding-left, padding-right. Distancia entre

Table {padding-top: 12pt}

margin: ancho1 ancho2 ancho3 ancho4

2.5. Propiedades del borde

border-top-width, border-bottom-width, border-left-width, border-right-

thin | medium | thick | XX unidad

border-width. Especificamos en una única propiedad el ancho de todo el área de

thin | medium | thick | XX unidad

/Fin del fichero hoja_estilo.css/