Home > Developer > Web Develop
Transferred from the http://andymao.com/section:
Absolute,css in the wording is: position:absolute; He means absolute positioning, out of the text flow (that is, in the document has not occupied the position ), he is referring to the top left corner of the browser, with the upper, right, BOTTOM, leave (hereinafter referred to as TRBL) for positioning , without setting TRBL, By default , the original point is the origin point of the parent's marker . 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.
In the middle 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 of the original point, will not be the change in 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; What he means is absolute relative positioning, which still occupies a position in the document, but visually moves relative to its original position. He is referring to the original point of the parent as the original point, no parent is the original point of the body as the original point, with TRBL for positioning, when the parent has padding and other CSS properties, the current level of the original point is referenced to the parent content area of 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.
The above is the use of position. There is a more detailed blog: http://www.cnblogs.com/bokin/archive/2012/12/14/2816864.html
Own part of the understanding
In fact, I understand the above position, why did I suddenly go to check?
The reason is this time, I did not write position attribute, directly write the value of TRBL. The code is as follows:
<style>#div1{width:100px;Height:200px;background:#CCC; Right:100px;}</style><Script></Script> </Head><Body><DivID= "Div1"> <span>Share to</span></Div><inputtype= "button"value= "Bian"onclick= ' Move () '/></Body></HTML>
I would like to direct the DIV1 to the right, this can not do?
The answer is NO!
Looked a lot of places, just understand:
When the position value is not set, the default is static, so it has no effect.
When you use TRBL, you must remember to match position settings.
TRBL and position relationships in CSS
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
