Académique Documents
Professionnel Documents
Culture Documents
<style type="text/css">
p { color: black; font-family: Verdana; }
</style>
<link
href="hoja_de_estilo.css"
type="text/css" />
rel="stylesheet"
los
Unidades absolutas
in (pulgadas)
cm (centmetros)
mm (milmetros)
pt (puntos)
pc (picas)
px (pixeles)
Unidades relativas
em
ex
Unidades de porcentaje
%
Palabras Clave
CSS define 17 palabras clave para referirse a los
colores bsicos. Las palabras se corresponden
con el nombre en ingls de cada color.
Adems de la lista bsica, los navegadores
modernos soportan muchos otros nombres de
colores. La lista completa se puede ver en
http://en.wikipedia.org/wiki/Websafe
RGB decimal
Cada una de las componentes puede tomar un valor entre cero y 255.
p { color: rgb(71, 98, 176); }
Si se indica un valor menor que 0 para una componente, automticamente se
transforma su valor en 0. Igualmente, si se indica un valor mayor que 255, se
transforma automticamente
su valor a 255.
RGB porcentual
Otra forma de indicar las componentes RGB de un color
es mediante un porcentaje. Igual que el del RGB
decimal. La nica diferencia en este caso es que el
valor de las componentes RGB puede tomar valores
entre 0% y 100%.
p { color: rgb(27%, 38%, 69%); }
RGB hexadecimal
Es el mtodo ms utilizado.
Se agregan las componentes RGB en hexadecimal del
color antecedidas del prefijo #.
p { color: #4762B0; }
Propiedad
Descripcin
margin
Establece de
forma directa
todos los
mrgenes de un
elemento
margin-top
Margen superior
marginright
Margen derecho
marginbottom
Margen inferior
margin-left
Margen izquierdo
Se aplica
Valores
a
Todos los
elementos
salvo
algunos
casos
especiales
de
elementos
mostrados
como
tablas
Valo
r
Inici
al
Medida,
porcentaj
e, auto,
inherit
0
0
0
0
Propiedad
Descripcin
padding
Establece de
forma directa
todos los rellenos
de un elemento
Relleno derecho
paddingbottom
Relleno inferior
paddingleft
Relleno izquierdo
Se aplica
Valores
a
Todos los
elementos
excepto
algunos
elementos
de tablas Medida,
como
porcentaj
grupos
e, inherit
de
cabeceras
y grupos
de pies de
Valo
r
Inici
al
0
0
0
0
Descripcin
border-width
Ancho de todos
los bordes del
elemento
border-topwidth
Ancho borde
superior
border-rightwidth
Ancho borde
derecho
border-bottom-
Ancho borde
Se
aplica a
Valore
s
medida
, thin,
Todos los
mediu
element
m,
os.
thick,
inherit
COLOR
Propiedad
Descripcin
border-color
border-top-color
border-left-color
Color borde
izquierdo
Se
aplica a
Valores
ESTILO
Propiedad
Descripcin
border-style
Estilo de cada
uno de los
bordes.
border-topstyle
Estilo borde
superior
border-rightstyle
Estilo borde
derecho
borderbottom-style
Estilo borde
inferior
border-leftstyle
Estilo borde
izquierdo
Se
aplica a
Valores
none, hidden,
dotted, dashed,
Todos los
solid, double,
element
groove, ridge,
os.
inset, outset,
inherit
PROPIEDADES SHORTHAND
Propiedad
Descripcin
border
border-top
borderright
borderbottom
border-left
Se
aplica a
Valores
Ancho
Todos los
borde,
element
Color borde
os.
Estilo borde
Propiedad
Descripcin
Valores
background
background-color,
background-image,
background-repeat,
Fondo de un elemento
background-attachment,
background-position,
inherit
backgroundcolor
Color de fondo
color, transparent,
inherit
backgroundimage
Imagen de fondo
Propiedad
Descripcin
Valores
backgroundrepeat
Repeticin de la
imagen de fondo
repeat, repeat-x,
repeat-y, no-repeat,
inherit
backgroundposition
Posicin de la
imagen de fondo
x (porcentaje, medida,
left, center, right)
y (porcentaje, medida,
top, center, bottom)
inherit
backgroundattachment
Comportamiento
de la imagen de
fondo
Propied
Descripcin
ad
Valores
Selecciona el
positio
posicionamiento con el que
n
Propied se mostrar el elemento
Descripcin
ad
Static, relative,
absolute, fixed, inherit
Valores
top
right
bottom
left
Desplazamiento
Desplazamiento
derecho
Desplazamiento
Desplazamiento
izquierdo
superior
lateral
inferior
lateral
Medida, porcentaje,
auto, inherit
Propied
Descripcin
ad
Valores
Establece el tipo de
float
posicionamiento flotante del
Propied elemento
Descripcin
ad
clear
Propied
Descripcin
ad
display
Permite controlar
la forma de
visualizar un
elemento e
incluso ocultarlo
Valores
inline, block, none, list-item, run-in,
inline-block, table, inline-table,
table-row-group, table-headergroup, table-footer-group, table-row,
table-column-group, table-column,
table-cell, table-caption, inherit
Propied
Descripcin
ad
Valores
Propieda
Descripcin
d
Valores
color
Establece el color de
letra utilizado para
Color, inherit
el texto
fontfamily
Establece el tipo de
letra utilizado para
el texto
nombre_familia,
familia_generica, inherit
Establece el tamao
de letra utilizado
para el texto
Tamao absoluto (xx-small, xsmall, small, medium, large, xlarge, xx-large), tamao
relativo, medida, porcentaje,
inherit
font-size
Familia
Generica
Fuente
serif
sans-serif
cursive
fantasy
monospace
Propieda
Descripcin
d
Valores
fontweight
Establece la anchura de
la letra utilizada para el
texto.
fontstyle
Establece el estilo de la
letra utilizada para el
texto
font
Opcionalmente font-style,
font-variant, font-weight
Permite indicar de forma Obligatoriamente fontdirecta todas las
size
propiedades de la
Opcionalmente linetipografa de un texto
height
Obligatoriamente font-
Propiedad
Descripcin
Valores
text-align
Establece la
alineacin del
contenido del
elemento
line-height
Permite establecer la
altura de lnea de los
elementos
textdecoration
Establece la
decoracin del texto
(subrayado, tachado,
parpadeante, etc.)
Propiedad
Descripcin
Valores
texttransform
Transforma el texto
original a maysculas, a
minsculas, etc.
capitalize, uppercase,
lowercase, none, inherit
verticalalign
Determina la alineacin
vertical de los
contenidos de un
elemento
text-indent
Tabula desde la
izquierda la primera
lnea del texto original
Medida, porcentaje,
inherit
Propiedad
Descripcin
Valores
letterspacing
Permite establecer el
espacio entre las letras
que forman las palabras
del texto
wordspacing
Permite establecer el
espacio entre las
palabras que forman el
texto
whitespace
Establece el tratamiento
de los espacios en
blanco del texto
Propiedad
Descripcin Valores
list-styletype
Establece el
tipo de
vieta
mostrada
para una
lista
list-styleposition
Establecer la
posicin de
la vieta de
inside, outside, inherit
cada
elemento de
una lista
Propiedad
Descripcin
Valores
list-styleimage
Reemplaza las
vietas automticas
por una imagen
personalizada
list-style
Establece de forma
simultnea todas las
opciones de una lista
Propiedad
Descripcin
Valores
bordercollapse
collapse,
separate,
inherit
borderspacing