在做页面设计时,以前总是在两个浮动中间留一条边边 很难看,
html:
<body> <div id="page-container"> page-container <div id="top" >top</div> <div id="menuBar" >MenuBar</div> <div id="left" >Left</div> <div id="centre" >Centre</div> <div id="right" >Right</div> <div id="footer" >Footer</div> </div> </body>
CSS1:
#left { background-color:orange; padding:0 0 0 0; float:left; width:15%; height:600px; } #centre { background-color:white; padding:0 0 0 0; width:70%; color:black; height:600px; } #right { background-color:black; float:right; width:15%; height:600px; margin-top:-600px; margin-left:75%; }
效果这样
如果改一下 CSS中间的Centre 加上一句Float
#centre { background-color:white; padding:0 0 0 0; width:70%; color:black; height:600px; float:left;/*就加上这一句效果就完全不同了!!!!!!!!!*/ }