三行两列DIV布局之左固定宽度

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

< html >
< head >
    
< title > Untitled </ title >
    
< style  type ="text/css" >
        body
{}{
            
/**//*布局样式*/
            text-align
:center; /**//* 这里,配合DIV的margin,设置DIV水平居中*/
        
}

        #layout_header, #layout_footer
{}{
            
/**//*布局样式*/
            margin
:0px auto;  /**//*水平居中*/
            width
:98%;
            
        
}

        #layout_header
        
{}{
            
/**//*这里可以自定*/
            height
:50px;
        
}

        
        #layout_container
{}{
            
/**//*布局样式*/
            margin
:0px auto;  /**//*水平居中*/
            width
:50%;
            
/**//*这里可以自定*/
            text-align
:left; 
            background-color
:#CCE7FF;
            border
:solid 1px red;
        
}

        
        #layout_right_layout
{}{
            
/**//*布局样式*/
            width
:100%;
            margin
:2px 0px 2px -100%; 
            float
:right;
        
}

        
        #layout_right
{}{
            
/**//*布局样式*/
            float
:left;
            margin
:0px 0px 0px 170px; /**//*这里对应左侧栏的宽度*/
            
/**//*这里可以自定*/
            background-color
:#fff;
        
}

        
        #layout_left
{}{
            
/**//*布局样式*/
            float
:left;
            width
:160px;       /**//*左侧栏的宽度*/
            margin
:2px 0px 2px 0px; 
            
/**//*这里可以自定*/
            background-color
:#eef6ff;
        
}

        
    
</ style >
</ head >

< body >
< div  id ="layout_header" >
    这里头
</ div >
< div  id ="layout_container" >
    
< div  id ="layout_right_layout" >
        
< div  id ="layout_right" >
                asdfasdf
            
< table  style ="border:solid 1px red;width:100%;"  border ="0"  cellpadding ="0"  cellspacing ="0"  id ="lable" >
                
< tr >
                    
< td >
                        
< span  id ="ctl00_WebSiteNavigate1_labelPageDescription" > 对会员进行查询列表 </ span >
                    
</ td >
                
</ tr >
            
</ table >
        
</ div >
    
</ div >
    
< div  id ="layout_left" >
        这里写菜单
    
</ div >

< div  style ="clear: both;display: block" >   </ div > <!--  这里解决FF 中 layout_container 高度不能自适应  -->
</ div >
< div  id ="layout_footer" >
    这里有版权
</ div >


</ body >
</ html >
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值