CSS实现页面两列布局与三列布局的方法示例

2020-05-14 07:17:18易采站长站整理

            position:absolute;     
            width:100%;     
            height:auto;     
            top: 100px;     
            bottombottom:50px;                       
        }     
        .left {     
            width: 15%;    /*这里是百分比或者像素值,对应下面的center就是百分比或者像素值*/     
            background: red;     
            float: left;     
            height:100%;     
        }     
        .rightright {     
            width: 15%;  /*这里是百分比或者像素值,对应下面的center就是百分比或者像素值*/     
            height: 100%;     
            background: pink;     
            float: rightright;     
        }     
        .center {     
            height: 100%;     
            background: green;     
            /*两种方式均可(一)margin(二)margin-left、margin-right*/     
            /*(一)、用这种方式上面的left和right中的width是百分比或者像素值都可以*/     
            margin: auto;