Un elemento en html consta de una estructura la cual determina el espacio que ocupa en una pagina.
Esta estructura se conforma por:
El Ancho y el alto del elemento:
width y height
El relleno interno del elemento:
Padding
El Borde que posee el elemento
Border
El Margen que posee con relación a los otros elementos.
Margin
Ejemplo: Si nosotros tenemos un “div” y queremos configurar todas sus
propiedades del modelos de caja seria de la siguiente forma.
div {
width: 20px;
height: 20px;
background: blue;
padding: 20px;
box-sizing: border-box;
border: 1px solid hotpink;
margin: 20px;
}