一行中有3个div，并且要使div分别向左、居中、向右对齐

首先第一种方法是：

    
    
    
    
    



    

        
左边
        
右边
        
中间

    

第二种方法是：
注意，设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效。
那我们怎么使用flex去写呢？
只需要在父级给display: flex; justify-content: space-between;这两个即可

		

			
		
		

			
		
		

			

				

					登录
				
				

					注册
				
				

					购物车
				
			
		
	

.header{
	width: 100%;
	height: 84px;
	display: flex; 
	justify-content: space-between;
}
.header-left{
	width: 140px;
	height: 62px;
	padding-top: 11px;
}
.header-left img{
	width: 100%;
	height: 100%;
}
ul{
	overflow: hidden;
	margin: 0px;
	padding: 0px;
}
.header-right>ul>li{
	float: left;
	margin-right: 20px;
	line-height: 84px;

}

这样做出来的结果就是比较完美的，就算你是缩小屏幕你的布局也不会乱

当然了上面的 space-between并不是只有一个， space-between表示的使中间两头对齐，中间居中对齐，justify-content：后面一共可以跟6中属性，就是下面图中的。
注意：使用flex之后就不要在使用float，因为float已经没有效果了