Understanding Absolute and relative_css/html in CSS

Many friends asked me absolute and relative how to distinguish, how to use? We all know that absolute is absolute positioning, relative is relative positioning, but what does this absolute and relative mean? Absolutely where is absolute, relative is relative to what place is it? What kind of characteristics do they have, and what kind of effect can they make? What kind of skills are there between the two? Let's take a one by one reading.

Absolute,css in the wording is: position:absolute; TOP, right, BOTTOM, left (hereinafter referred to as TRBL) for positioning, in the absence of a set TRBL, by default, the original point of the parent is the original point. If you set TRBL and the parent does not set the Position property, the current absolute is positioned as the original point in the upper left corner of the browser, and the position is determined by TRBL.

Generally speaking, the center of the page with absolute is prone to error, because the Web page has been automatically adapted to the size of the resolution, and absolute will be the browser's upper left corner as the original point, not to change the resolution of the location. Many people make mistakes because they make mistakes. and the Web page left its characteristic and relative very similar, but still has the essential difference.

Relative,css in the wording is: position:relative; He means absolute relative positioning, he is referring to the original point of the parent is the original point, no parent is the original point of the body as the original point, with TRBL to locate, when the parent has padding and other CSS properties, the current level of the original point of the parent content area to refer to the original point to locate.

Sometimes we also need to rely on Z-index to set the upper and lower relationship of the container, the larger the value is on the top, the value range is the natural number. Of course, there is a point to note that the parent-child relationship is unable to use Z-index to set up the upper and lower relations, must be the child in the upper parent.

