Div and span, relative and absolute, display and visibility are easily confused and mistaken HTML tags and CSS attributes.
1、 Difference between div and span
A div is a block level element that can contain paragraphs, tables, and other contents to place different contents. Generally, we use div to locate each block in the webpage.
Span is an inline element, which has no practical significance. It exists purely to apply styles. Adding<span></span>tags to a piece of content can set the style of its content by defining a style on span.
2、 Difference between relative and absolute
Relative, the writing method in CSS is: position: relative; It means absolute relative positioning. It refers to the original point of the parent level as the original point. If there is no parent level, the original point of BODY will be used as the original point to coordinate with TRBL for positioning. When there are CSS attributes such as padding in the parent level, the original point of the current level will refer to the original point of the parent content area for positioning.
Absolute. The writing method in CSS is: position: absolute; He means absolute positioning, he means reference browser In the upper left corner of the, coordinate with TOP, RIGHT, BOTTOM, LEFT (hereinafter referred to as TRBL) to locate. If no TRBL is set, the parent's original marking point is the original point by default. If TRBL is set and the parent does not set the position attribute, then the current absolute will use the upper left corner of the browser as the original point for positioning, and the position will be determined by TRBL.
3、 Difference between display and visibility
Both display: none and visibility: hidden can hide an element
However, visibility: hidden only hides the content of the element, but the location space it uses is still reserved.
On the other hand, display: none removes the element from the page and its occupied position will also be deleted.
