1.
The existence of four types of boxes:
(1) The box of block elements;
(2) The box of inline elements;
(3) Inline box; (different from the box of inline elements)
(4) Inline box.
2.
According to the standard, the text in the inline box is centered. That is, the distance between the top edge of the inline box and the top of the text should be half of the leading edge (the distance between the bottom of the text and the top of the descending text).
However, under different browsers, the position of the text will be 1 to 2 pixels different from the middle. Since this difference is very small, it can be ignored.
3.
If height is not set.
(1) Factors affecting the height of the block element box:
If the child element is a block element, the height of the margin box will affect it.
The child element is an inline element, and the height of the line box (indirectly determined by the height of the inline box) is not determined by the height of the inline element border.
(2) Factors affecting the height of the inline element box:
font size (font-size).
Other factors are currently unknown.
4.
5.
There is a 3-pixel blank space below . To eliminate the blank space: display: block.
6.
The child element is absolutely positioned relative to the parent element. When the position of the child element exceeds the box of the parent element, if the parent element sets overflow: hidden, the child element will disappear. .