zoukankan html css js c++ java

[css layout][11] three fixed columns

1.全部float向左。#wrapper宽度900px

 1 #container {
 2   width: 900px;
 3   margin: 0 auto;
 4 }
 5 #wrapper {
 6   width: 900px;
 7   float: left;
 8 }
 9 #content {
10   margin-left: 400px;
11 }
12 #navigation {
13   width: 200px;
14   float: left;
15   margin-left: -900px;
16 }
17 #extra {
18   width: 200px;
19   float: left;
20   margin-left: -700px;
21 }
22 #footer {
23   clear: both;
24 }

2.float向右。#wrapper宽度900px

 1 #container {
 2   width: 900px;
 3   margin: 0 auto;
 4 }
 5 #wrapper {
 6   width: 900px;
 7   float: right;
 8 }
 9 #content {
10   margin-left: 400px;
11 }
12 #navigation {
13   width: 200px;
14   float: right;
15   margin-right: -200px;
16 }
17 #extra {
18   width: 200px;
19   float: right;
20   margin-right: -400px;
21 }
22 #footer {
23   clear: both;
24 }

3.float向右，#wrapper宽度500px

 1 #container {
 2   width: 900px;
 3   margin: 0 auto;
 4 }
 5 #wrapper {
 6   width: 500px;
 7   float: right;
 8 }
 9 #navigation {
10   width: 200px;
11   float: right;
12   margin-left: -200px;
13   position: relative;
14   left: -200px;
15 }
16 #extra {
17   width: 200px;
18   float: right;
19 }
20 #footer {
21   clear: both;
22 }

4.float向左，#wrapper宽度500px

 1 #container {
 2   width: 900px;
 3   margin: 0 auto;
 4 }
 5 #wrapper {
 6   width: 500px;
 7   float: left;
 8   margin-right: -400px;
 9   position: relative;
10   left: 400px;
11 }
12 #navigation {
13   width: 200px;
14   float: left;
15   margin-left: -100px;
16 }
17 #extra {
18   width: 200px;
19   float: left;
20 }
21 #footer {
22   clear: both;
23 }

查看全文

相关阅读:
SQL 基础题。
C# 多维数组.
C# 泛型相关.
C# 委托数组.
ActiveX的数字签名
 Asp.Net Html标记替换.感谢个热心人。弄了好久.
关于TableLayoutPanel里放入控件无法将Dock设为Fill的解决办法
 服务器×××上的MSDTC不可用解决办法
 vista home下运行asp.net2.0 程序环境配置
 麦克风的调节

原文地址：https://www.cnblogs.com/qiudeqing/p/3423903.html