lovecoding
/
J250419


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041
							<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>CSS浮动</title>
</head>
<body>
<style>
    /*
        CSS float属性设置元素要怎么浮动
        CSS clear属性设置哪些元素可以在清除的元素旁边以及哪一测浮动。
        float主要是用来定位和格式化内容
    */
    div {
        width: 100px;
        height: 100px;
        border: solid 2px red;
    }
    .f1{
        background-color: red;
        float: left;
    }
    .f2{
        background-color: #00ff00;
        clear: none;
        float: left;
    }
    .f3{
        background-color: #0000ff;
    }
    .f4{
        background-color: #000;
        float: left;
    }
</style>
</body>
<div class="f1"><h1>1</h1></div>
<div class="f2"><h1>2</h1></div>
<div class="f3"><h1>3</h1></div>
<div class="f4"><h1>4</h1></div>
</html>