CSS有四种定位(Positioning)方法:Static,Relative, Absolute和Fixed
元素flow, overlap
| 相对参照物: | 能否用offset( top, left, bottom, right)参数 | 是否移出 normal flow | 是否可以 overlap | 备注 |
Static | 缺省的, | 忽略 | No |
|
|
Relative | its own normal position | √ | No | Yes | 常用作 Absolute元素的container |
Fixed | browser windows | √ | Yes | Yes | ignore scrolling |
Absolute | 相对于 * 首个非static的父元素, (包括relative的), * document body元素(如果没有非static元素的话) | √ | Yes | Yes |
|
偏移量(offset)的描述: /coordinate: top, bottom, left, and right
使用 max-width 替代 width 可以使浏览器更好地处理小窗口的情况。这点在移动设备上显得尤为重要,
移动浏览器对 fixed 的支持很差, tips见 :http://bradfrost.com/blog/mobile/fixed-position/
http://www.w3schools.com/css/css_display_visibility.asp
http://zh.learnlayout.com/margin-auto.html
* 搞定zIndex:'Auto' means that element gets z-index from its parent.
水涨船高, 后面的总会比他高(继承了!!!)
用图片美化按钮:
.{
position: ;
left:;
top:;
z-index: ;
background: () ;
}
Positioning, layout, coordinate and offset