div 布局

css 代码

1. @charset "utf-8" ;   
2.   
3. body {   
4.     padding: 0px;   
5.     margin: 0px;   
6.     font-size: 12px;   
7.     line-height: 16px;   
8.     TEXT-ALIGN: center;   
9. }   
10.   
11.   
12.   
13. #header{   
14.     /*float: left;*/  
15.     clear: both;   
16.     border:1px solid #000;   
17.     text-align: center;   
18.     margin-top: 2px;   
19.     margin-right: auto;   
20.     margin-left: auto;   
21.     width : 800;   
22.     height:100px;   
23. }   
24.   
25. #footer {   
26.     clear: both;   
27.     border:1px solid #000;   
28.     text-align: center;   
29.     width: 800;   
30.     margin: 3;   
31.     margin-right: auto;   
32.     margin-left: auto;   
33.     font-size: 12px;   
34.     color: #999999;   
35. }   
36.   
37. /* 这个让元素居中*/  
38. #container {   
39.     position:relative;   
40.     width: 812px;   
41.     height: 800px;   
42.     border:1px solid #000;   
43.     margin-right: auto;   
44.     margin-left: auto;   
45.     TEXT-ALIGN: center;   
46. }   
47.   
48.   
49.   
50. #left {   
51.     border:1px solid #000;   
52.     float: left;   
53.     width: 150px;   
54.     margin: 3px;   
55.     margin-right: auto;   
56.     margin-left: 3px;   
57.     background-color: red;   
58. }   
59. #right {   
60.     border:1px solid #000;   
61.     float: rightright;   
62.     width: 150px;   
63.     margin-top: 3px;   
64.     margin-right: 3px;   
65.     margin-left: auto;   
66.     background-color: green;   
67. }   
68. #middle {   
69.     width: 490;   
70.     border:1px solid #000;   
71.     padding: 0px 160px 5px 160px;   
72.     margin-top: 3px;   
73.     margin-right: auto;   
74.     margin-left: auto;   
75.     background-color: silver;   
76. }  

页面

html 代码

1.     <DIV id="container">  
2.        
3.     <c:import url="/jsp/web/include/head.jsp">c:import>  
4.     <DIV id="left" align="center">Port side text...    
5.     <BR/><A name="ll" href="jsp/web/include/juzhong.jsp"> juzhong A>g   
6.     <BR/>  
7.     <BR/>  
8.     <BR/>  
9.     <BR/>  
10.     <BR/>  
11.     <BR/>  
12.        
13. DIV>  
14.     <DIV id="right" align="center">  
15.         Starboard side text...   
16.        
17.     DIV><DIV id="middle" align="center">  
18.         Middle column text...   
19.     DIV>  
20.   
21.     <c:import url="/jsp/web/include/footer.jsp">c:import>  
22.     div>