Introduction to Position:relative in CSS;

This article mainly introduces the position:relative in the CSS, the role of the introduction, has a certain reference value, now share to everyone, the need for friends can refer to

The position:relative in CSS is the relative positioning of the control element, relative not out of the document flow and absolute out of the document flow, relative element although it appears to deviate from the original position, but it actually in the document flow still remains unchanged

References

Static: No special positioning, object follows HTML positioning rules
Absolute: Drag objects out of the document stream and use attributes such as left,right,top,bottom for absolute positioning. And its cascade is defined by the Z-index property. Objects do not have margins at this point, but they still have padding and borders
Relative: objects are not stackable but will be offset in normal document flow based on attributes such as Left,right,top,bottom
fixed:ie5.5 and NS6 do not yet support this property

"For a static P#demo in the page, I want to make this #demo in a p#sub relative to the #demo location in the upper right corner of a place, should be with this position:relative this bar, and then add top,right to limit it."
I don't understand, right? "
First of all you have doubts about the place, I first answer:
The default value of position is static (that is, for any element, if it does not have its position attribute defined, its position:static)
If you want a p#sub in this #demo to be positioned in the upper right corner, relative to #demo, the #demo should be positioned relative to the #sub绝对定位.
Absolute is relative to their nearest parent element to locate, if you do not give #demo relative positioning, then the absolute positioning of #sub is relative to the body to locate.
Relative is positioned relative to itself, for example: #demo {position:relative;top:-50px;}, at which point the #demo will move 50px relative to its original position.
Another: relative does not detach from the document flow, absolute out of the document stream. That is: the element of relative, although it appears to deviate from its original position on the surface, is actually still unchanged in the document flow. The elements of absolute not only changed position, but also separated from the flow of documents.

An example is written as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < HTML xmlns= "http://www.w3.org/1999/xhtml" > 
 The above is the whole content of this article, I hope that everyone's learning has helped, more relevant content please pay attention to topic.alibabacloud.com!