利用WEB标准创建两栏页面布局

作者:袖梨 2022-07-02

使用 Web 标准进行页面设计,有一种信仰就是不使用表格兰进行基本的页面排版。
网页常见的两栏布局,我们往往就是通过一个 1 行 2 列的表格来实现。例如:

 代码如下 复制代码

    
        
        
    
左侧栏右侧栏

使用 div 对象的 float 属性,完全也可以实现,页面代码如下:

 代码如下 复制代码

    
左侧栏

    
右侧栏


配套的 CSS 代码是:
#Container {
    width: 760px;
}
#SideColumn {
    width: 200px;
    float: left;
    border: 1px solid #00F;
}
#MainColumn {
    width: 550px;
    float: right;
    border: 1px solid #000;
}

 

相关文章

精彩推荐