继续补充之前的布局与定位知识。
定位
静态定位
position:static 这是默认的定位，所有元素还是在流里面。
绝对定位
position:absolute
-
绝对定位元素对其他元素没有任何影响。
-
任何元素——内联和块都可以使用绝对定位
-
指定元素位置时可以使用百分比，如left10%代表窗口宽度的10%。
-
绝对定位元素中的z-index可以表示两个元素哪个在上面，z元素越大，代表离屏幕越近。
-
偏移量是对于页面的偏移量，若是嵌套关系，则是相对于离它最近的父元素的偏移量。
固定定位
position:fixed
- 元素的位置是距离窗口边界的一个偏移量，而不是距页面边界的距离。——因此滚动页面也不会移动
- 其他特性与绝对定位一样，页面中的其他内容可以再固定定位下滚动。
相对定位
postion:relative 相对定位元素首先正常流入页面，然后按指定的量偏移，从而流出它们原先的空间。
使用表格布局
- 与HTML的不同：HTML表格面向的是表格数据，CSS表格是用表格来显示创建某种布局的方法
- 外边距不会与边框间距（border-spacing)折叠
- 一行多列的情况下最好使用百分数，确保窗口调整，布局仍比较OK
样例代码如下，html结构是一个大的div，包裹一个行div，行div里面再包裹单元格div，这里是两个并列单元格
#tableContainer{
display: table;
border-spacing: 10px;
}
#tableRow{
display: table-row;
}
#main {
display: table-cell;
background: #efe5d0 url(images/background.gif) top left;
font-size: 105%;
padding: 15px;
/* margin: 0px 10px 10px 10px; */
vertical-align: top;
}
#sidebar {
display: table-cell;
background: #efe5d0 url(images/background.gif) bottom right;
font-size: 105%;
padding: 15px;
/* margin: 0px 10px 10px 10px; */
vertical-align: top;
}
