CSS
/*----------------------------------------------
*页面基本属性*/
html, body, h1, p {
margin: 0;
padding: 0;
}
body {
text-align: center;
text-shadow: 1px 1px 1px #A4A4A4;
/*padding-left:240px;*/
}
a {
color: #006;
}
/*页面基本属性结束
----------------------------------------------*/
/*----------------------------------------------
*装饰*/
div#header {
background: #EEE;
color: #79B30B;
}
div#navigation {
background: #B9CAFF;
color: #FF8539;
}
div#extra {
background: #FF8539;
color: #B9CAFF;
}
div#footer {
background: #444;
color: #ddd;
}
/*-----------------------------*/
div#header {
height: 100px;
line-height: 100px;
}
div#content {
height: 100px;
line-height: 100px;
}
div#navigation {
height: 100px;
line-height: 100px;
}
div#extra {
height: 100px;
line-height: 100px;
}
div#footer {
height: 60px;
line-height: 60px;
}
/*装饰结束
----------------------------------------------*/
/*----------------------------------------------
*布局*/
div#wrapper { /* 主栏外包含框基本样式 */
float:left; /* 向左浮动 */
width:100% /* 百分比宽度 */
}
div#content {/* 主栏内包含框基本样式 */
margin: 0 200px /* 在左右两侧预留侧栏空间 */
}
div#navigation {/* 导航栏基本样式 */
float:left; /* 向左浮动 */
width:200px; /* 固定宽度 */
margin-left:-100% /* 左外边距取负值进行定位 */
}
div#extra {/* 其他栏基本样式 */
float:left; /* 向左浮动 */
width:200px; /* 固定宽度 */
margin-left:-200px /* 左外边距取负值进行定位 */
}
div#footer {
clear:left;
width:100%
}
/*布局结束
----------------------------------------------*/