1. The visual difference between inline and block-level elements
Inline elements are arranged in a straight line, all in the same row, arranged horizontally
Block-level elements occupy one line and are arranged vertically. Block-level elements start at the beginning of the new row and then a line break.
2. Block-level elements can contain inline elements and block-level elements. Inline elements cannot contain block-level elements.
3. The difference between the inline element and the block-level element attribute is mainly on the box model attribute
The inline element setting width is invalid, the height is invalid (can be set line-height), margin is invalid, padding up and down invalid
4. a block-level element will have a single row and its width automatically fills the width of its parent element, unless the custom width
Inline elements do not have a single row, and adjacent inline elements are arranged in the same row, knowing that a row does not fit before wrapping, and its width varies with the content of the element.block-level elements have their own area, while inline elements do not have their own area
Can be display:block by CSS | | Inline to switch
The difference between a row element and a block element