页面左中右分栏布局在目前的网页布局中是比较常见的,下面就与大家分享两个不错的方法可以实现左中右分栏布局,代码很详细,需要的朋友可不要错过
以下代码复制粘贴即可使用:
示例一:
.page_center {
width:100%;
}
#nav {
background-color:red;
height:20px;
}
#left {
width:120px;
background-color:green;
position:absolute;
}
#middle {
background-color:yellow;
}
#right {
width:120px;
background-color:green;
position:absolute;
top:0;
right:0;
}
#foot {
background-color:pink;
}
#main {
position:relative;
}
左边
中间部分
右边
底边
示例2:
Untitled Document#left{
float:left; width:240px; height:500px; background:#0C9;
}
#right{
float:right;width:240px;height:500px; background:#933;
}
#center{
height:500px;background:#06C;
}
左边
右边
中间
以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!
相关推荐: