Maquetación Parte 4 inline - block


Inline
Elemento en línea, el elemento se coloca a continuación del otro en el plano horizontal.
Por ejemplo tenemos tres elementos <div>



Le aplicamos este estilo.



Este es el resultado.


Block
Elemento en bloque, el elemento se coloca uno encima de otro en el plano vertical.





Cada elemento <div> debemos de tratarlo como una caja. Cada caja consta de:

Borde (border) es lo que separa el interior del exterior del elemento (negro)
Margen  (margin) es la parte exterior del elemento (naranja)
Relleno  (padding) es el espacio que hay entre el contenido y el borde (verde)
Contenido  es la parte interior la que contiene el texto, una imagen, un video etc. (azul)


Propiedades:

Width tamaño de ancho del elemento
Height tamaño de alto del elemento
Max-width ancho máximo que puede ocupar el elemento
Min-whidth ancho mínimo que puede ocupar el elemento
Max-height alto máximo que puede ocupar el elemento
Min-height alto mínimo que puede ocupar el elemento
Top         parte superior del elemento
Left         parte izquierda del elemento
Right parte derecha del elemento
Bottom parte inferior del elemento
Center centro del elemento



No hay comentarios:

Publicar un comentario