css浮动
结论,非浮动元素可以为后面的浮动元素定位, 但是 浮动元素无法再为其后的非浮动元素定位。
No-float A + Float B + No-float C
c和b 会按照A的边界进行定位,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML><HEAD><TITLE>CSS TEST</TITLE> <style type=text/css> body{ text-align: center; background: #000; } #container{ width:778px; background: #e3e3e3; margin:0px auto; } #idParentDiv{ width:760px; margin:0px auto; text-align:left; } #boxleft{ width:200px; height:80px; background-color:yellow; } #boxmiddle{ float:left; width:250px; height:100px; background-color:red; } #boxright{ width:250px; height:120px; background-color:blue; } </style> <body> <div id=container> <div id=idParentDiv> <div id=boxleft>boxleft---width:200px;height:20px;color:#FFFFFF;background-color:yellow;letter-spacing:0px; </div> <div id=boxmiddle>boxmiddle---float:left;width:250px;height:30px;background-color:red;</div> <div id=boxright>boxright----width:250px;height:50px;background-color:blue;</div> </div> </div> </body> </html>
点击这里返回本站的 网页设计教程 频道
|