CSS

CSS
INSTRUCCIONES QUE DEBE SEGUIR
EL NAVEGADOR
martes 13 de agosto de 2013

Con los estilos CSS se deﬁne la apariencia de los
elementos que se repetirán a lo largo de todo el sitio. Por
ejemplo: se puede deﬁnir el formato de los títulos,
asignándole el tipo y tamaño de tipografía, color y estilo.
Luego, todos los títulos del sitio web, usarán estos estilos
para los titulares.
¿para qué sirve
CSS?

contenido

forma

El código web de calidad se optimiza para que los
elementos propios del diseño (fondos, estilos de texto,
modalidades de presentación de elementos...) sea ligero,
esto es, con pocas instrucciones se consiga el efecto
visual deseado, y se reutilice múltiples veces.
velocidad de carga

- Definir un área dentro de un documento y asignarle un
color o una imagen de fondo.
- Modificar los márgenes de la página.
- Posicionar exactamente cualquier elementos dentro de
nuestra página, sin depender del tamaño de la misma, ni
del navegador.
- Posicionar imágenes de fondo en cada página o en cada
área que querramos.
podemos modificar

CSS deﬁne una serie de términos que
permiten describir cada una de las partes que
componen los estilos CSS.

TIPOS DE
SELECTORES

etiquetas: nativas de HTML
identidad: posicionamiento, un elemento
clase: múltiples elementos

body
{
background-color:#FFFFFF;
}
Selector: Etiqueta

¿Dónde?

documento
body
{
background-color:#FFFFFF;
}

#caja
{
background-color:#666666;
}
Selector: Identiﬁcador individual

¿Dónde?
vez por documento
1martes 13 de agosto de 2013

documento
#caja
{
background-color:#CF0033;
}

.datos
{
background-color:#00FFCC;
}
Selector: Identiﬁcador común

¿Dónde?
vez por documento
+1martes 13 de agosto de 2013

documento
.datos
{
background-color:#00FFCC;
}

CONTENEDORES
DIV

Una etiqueta <div> deﬁne un bloque donde incluiremos
información dentro de nuestro documento. A este bloque
deﬁnido con la etiqueta <div> le asignaremos por medio
del CSS, las propiedades de posición, tamaño, color, etc
etc.

<body>
etiquetas de deﬁnición de un
contenedor dentro de un documento
html
</body>
<div>
</div>

imaginemos los
divs como cajas
En una pagina web standard,
se visualizan normalmente 4
cajas imaginarias:
- Contenedor principal
- Encabezado
- Cuerpo
- Pie

veamos algo mas
gráﬁco

Tenemos el cuerpo de la
página, y dentro de ella
metemos cajas y las
ubicamos como queremos y
donde queremos.

menu
banner
cuerpo
}
}
}
footer}

preguntas??

CSS

Recommended

Recommended

More Related Content

What's hot

What's hot (19)

Viewers also liked

Viewers also liked (20)

Similar to CSS

Similar to CSS (20)

More from iConstruye

More from iConstruye (20)

CSS