box: box, each element generates a rectangular area on the page (box)
Box Type:
1. row box , the display attribute = inline element does not wrap (default)
2. The cassette block , the display attribute = block element wrap
Browser default style sheet cassette blocks: a container element, h1 ~ h6, p
Common Line box: span, a, img, video, audio
Part of the box
Whether the line cartridge or cassette blocks, has the following four parts, from the inside to the outside they are:
① the content area content
Box content: content-box
width height
② fill area padding
Filled cassette: padding-box (Content Area + area filled)
padding-left padding-right padding-top padding-bottom shorthand padding: on the right lower left (clockwise)
③ border border
Border of the housing: border-box (Content Area + + filled zone border)
Border Style Border Width border-style border-width (short) border color border-color (short)
border-top-width border-right-width border-bottom-width border-left-width
④ Margin margin
Distance from the border to the other box
margin-top margin-right margin-bottom margin-left
Shorthand margin
