标签:
position: relative | absolute | static | fixed
参考网站:http://www.jb51.net/css/22213.html
http://blog.jobbole.com/49320/
实践网站:http://www.w3school.com.cn/cssref/pr_class_position.asp
1.通过绝对定位,元素可以放置到页面上的任何位置,如果那个位置上有元素则覆盖了它。下面的标题距离页面左侧 100px,距离页面顶部 150px。
h2 {position:absolute;
left:100px; top:150px; }
2.通过相对定位,元素可以放置到页面上的任何位置,本身位置发生变化,而元素所占的物理空间还是存在,另外还有一点,定位后如果与原本那个位置上有元素,则与之重叠,两个元素都会显示
h2
{
position:relative;
left:100px;
top:150px;
}
如果两个元素重叠,则看z-index值的大小,显示z-index值最大的,默认的 z-index 是 0。Z-index 1 拥有更高的优先级。
3.float
前两步,使用绝对定位都并不是很理想,那么我们可以考虑使用float来解决。我们可以在一个元素上使用float,让元素向左或向右,
而且还可以使用文本围绕在这个元素的周边(这个作用在文本围绕图片特别有用)。下面来模拟一下 float:left/right
4.为了让浮动元素的父元素不在处于塌陷状态下,我们需要对浮动元素进行清除浮动:
clear
:
both
;
标签:
原文地址:http://www.cnblogs.com/lizhenlin/p/4764636.html