<!DOCTYPE html> <!--2CSS定位-浮动--> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <link type="text/css" href="css02.css" rel="stylesheet"> </head> <body> <div id="container"> <div id="div01">div01</div> <div id="div02">div02</div> <div id="div03">div03</div> <div id="div04text">hello04</div> </div> </body></html>
css:
#container { width: 1000px; height: 500px; background-color: #b3d4fc; } #div01 { width: 100px; height: 100px; background-color: brown; float: left; } #div02 { width: 100px; height: 100px; background-color: cadetblue; float: left; } #div03 { width: 100px; height: 100px; background-color: coral; float: left; } #div04text { width: 100px; height: 100px; background-color: bisque; /*左边不允许浮动元素*/ clear: left; }
07-29
07-29
07-29