你的位置:首页 > 网页设计

[网页设计]关于css布局的一些个人理解。(只是自己理解,不对的地方勿喷)


两列布局(左侧宽度固定,右侧自适应)

例如:

<!doctype html><html><head><title>左部宽度固定,右部自适应</title><meta charset="utf-8"/><style type="text/css">  *{    margin:0px;    padding:0px;    font-size:14px;  }  div{    height:600px;  }  .left{    width:300px;    background:red;    float:left;      }  body div.right{    background:green;    margin-left:300px;      }</style>  <link rel="stylesheet" type="text/css" href=""/></head><body>  <div >左部</div>  <div >右部</div></body></html>

三列布局,(左右宽度固定,中间自适应);

<!doctype html><html><head><title>左右宽度固定,中间自适应</title><meta charset="utf-8"/><style type="text/css">  *{    margin:0px;    padding:0px;    font-size:14px;  }  div{    height:700px;  }  .left{    width:300px;    background:red;    float:left;  }  .right{    width:400px;    background:yellow;    float:right;  }  .center{    background:blue;    margin:0 400px 0 300px;  }</style></head><body><div >左</div><div >右</div><div >中</div></body></html>