CSS BOX MODEL

Tipos de elementos

• Block level elements
• Inline level elements

Tipos de elementos

• Block level elements
• Inline level elements

Consideraciones:

• Nesting
• Positioning
• Relationships

Una vez establecido el layout

Se puede comenzar con diseño y desarrollo

Cada componente contiene un contenedor que determina su espacio en la página dependiente del contenido.

Lorem ipsum shalala

Lorem ipsum shalala

Las propiedades tipográficas que alteran su contenedor 

• @font-face
• font-family
• font-size
• font-weight
• font-style
• line-height
• letter-spacing
• word-spacing
• text-align
• text-indent
• text-transform
• text-decoration
• text-shadow
• box-shadow

Podemos cambiar el tamaño del contenedor (box) con CSS

Título

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Contenido

Padding

Border

Margen

Default display settings

Posicionamiento y flujo del contenido

• Static (default)
• Relative
• Absolute
• Fixed