水杯在使用position时候，情况是这样的在图片和按钮并列，按钮没出现
1.fixed:绝对定位-相对于浏览器
相对于浏览器窗口，固定位置，滚动条滑动，位置不改变。
2.absolute：绝对定位-相对于父级元素
相对最近父元素，原有空间不保留会被其他元素挤占。
宽度为文本宽度，且宽度不会影响父元素宽度
如果父级元素没有设置相对定位，会相对于根节点定位，如果是这样的结构，p标签上有absolute,而div上未设置相对定位
<body>
<div>
<p></p>
</div>
</body>则会相对于body进行绝对定位，跑出div的范围。即如果最近的父元素没有设置定位属性，将会以body为原点进行定位。
3.static：默认值，没有定位，元素出现在正常的流中
（忽略 top, bottom, left, right 或者 z-index 声明）
覆盖原有的定位，，可以把已定位的元素取消定位
4.relative：相对定位
相对自身原来位置，原有空间保留，不会被挤占。宽度为父元素宽度，且宽度会撑大/缩小父元素宽度。相对于自身的的意思是说，加上relative，top给10px,会在原来的位置上向上10px,参考自己原来的位置进行移动。
5.inherit:继承父元素的位置
如果父级元素是相对于浏览器窗口定位，那么子元素也相对于浏览器窗口定位，而不是父元素。
插播一个小知识
文档流：指语言文本从左向右，从上向下显示。
而浮动（float）、绝对定位(absolute)、固定定位（fixed）会脱离文档流。static和relative是不脱离文档流的。
使用绝对相对组合布局，布局清晰、方便管理。
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
