Shulou(Shulou.com)06/01 Report--

This article is about CSS position attributes. Xiaobian thinks it is quite practical, so share it with everyone for reference. Let's follow Xiaobian and have a look.

1. absolute (absolute positioning)

Absolute is an element that generates perceptual positioning, out of the text flow (i.e., no longer occupying a position in the document), and positioned by referring to the top left corner of the browser via top,right,bottom,left (TRBL). You can select a parent object with positioning (we'll talk about relative and absolute later) or a body coordinate origin for positioning, or you can use z-index for hierarchical ranking. Absolute is based on the coordinates of the parent object as the starting point when TRBL is not set. When TRBL is set, it is based on the upper-left corner of the browser as the original point.

2. relative (relative positioning)

Relative is relative meaning, as the name implies, is relative to the element itself in the document should appear in the position to move the element, you can move the position of the element through TRBL, in fact, the element still occupies the original position in the document, but visually relative to the original position has moved.

3. The combination of relative and absolute

Floats are often used in web design to lay out pages, but there are many uncertainties associated with floating (e.g., compatibility issues with Internet Explorer). Relatively speaking, positioning is easier, faster, and more compatible in some layouts (relative combined with absolute).

Thank you for reading! About "CSS position attributes what" this article is shared here, I hope the above content can have some help for everyone, so that everyone can learn more knowledge, if you think the article is good, you can share it to let more people see it!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.