css浮动 blog_zss小帅

浮动样式float:

float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。

默认值为：none；

可能的值为：

left：元素向左浮动；

right:元素向右浮动；

inherit：规定应该从父元素继承 float 属性的值。

用法：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>css浮动</title>
		<style>
			.left{
				height: 300px;
				 300px;
				background: wheat;
			    display: inline-block;/*首先这两个div都是块级元素先转换为行内元素*/
			   float: left;/*给左边的div加上float:left; div会往左浮动*/
			}
			.right{
				height: 300px;
				 300px;
				background:aquamarine;
			   display: inline-block;/*首先这两个div都是块级元素先转换为行内元素*/
			  float:right;/*给左边的div加上float:right; div会往右浮动*/
			}
		</style>
	</head>
	<body>
		<div class="left">我是左浮动</div>
		<div class="right">我是右浮动</div>
	</body>
</html>