zoukankan html css js c++ java

收集的css布局

 1 <title>左定宽，右自动</title>
 2 <style>
 3 body{margin:0px;padding:0px;}
 4 .box .left,.box .right{
 5     height:200px;line-height: 200px;text-align: center;
 6 }
 7 .box .left{
 8     float:left;width:200px;background-color:red;
 9 }
10 .box .right{
11     margin-left:210px;background-color: blue;
12 }
13 </style>
14 <body>
15     <div class="box">
16         <div class="left">左</div>
17         <div class="right">右</div>
18     </div>
19 </body>

 1 <title>左定宽，右自动(position+margin)</title>
 2 <style>
 3 body{margin:0px;padding:0px;}
 4 .box .left,.box .right{
 5     height:200px;line-height: 200px;text-align: center;
 6 }
 7 .box .left{
 8     position: absolute;width:200px;background-color:red;
 9 }
10 .box .right{
11     margin-left:210px;background-color: yellow;
12 }
13 </style>
14 <body>
15     <div class="box">
16         <div class="left">左</div>
17         <div class="right">右</div>
18     </div>
19 </body>

 1 <title>（两侧定宽，中间自适应）</title>
 2 <style>
 3 body{margin:0px;padding:0px;}
 4 .center,.left,.right{
 5     height:200px;line-height: 200px;text-align:center;
 6 }
 7 .left{
 8     float:left;width:200px;background-color:red;
 9 }
10 .right{
11     float:right;width:200px;background-color:yellow;
12 }
13 .center{
14     margin:0px 210px;background-color:blue;
15 }
16 </style>
17 <body>
18         <div class="left">左</div>
19         <div class="right">右</div>
20         <div class="center">中</div>
21 </body>

 1 <title>（两侧定宽，中间自适应）</title>
 2 <style>
 3 body{margin:0px;padding:0px;}
 4 .center,.left,.right{
 5     height:200px;line-height: 200px;text-align:center;
 6 }
 7 .left{
 8     position:absolute;top:0px;left:0px;width:200px;background-color:red;
 9 }
10 .right{
11     position:absolute;top:0px;right:0px;width:200px;background-color:yellow;
12 }
13 .center{
14     margin:0px 210px;background-color:blue;
15 }
16 </style>
17 <body>
18         <div class="left">左</div>
19         <div class="right">右</div>
20         <div class="center">中</div>
21 </body

查看全文

相关阅读:
"Illegal group reference"异常的分析
 一个基于WEB的js时间控件的实现
 ASP.NET网站的网络安全性
 关于"parseInt"
【C#算法】冒泡排序选择排序插入排序希尔排序转
 【c#】web.config续
 【C#】GridView用法
 [C#]接口引
 【SQL】DBCC
【C#】泛型

原文地址：https://www.cnblogs.com/mingwaer/p/3643387.html