CSS：三个div放在一排

<div> 1 </div>

<div> 2 </div>

<div> 3 </div>

 

方法一：div{display:inline-block;}  <!--不过div之间有空隙，并且不方便处理-->

方法二：div{float:left;}  <!--div之间无空隙-->

方法三：flex布局。123外面加一个div,这个div的style为：{display:flex; flex-direction:row;}   <!--row：排；column：列-->

 

浮动首先需要添加标准流父级

浮动总是找离它最近的父级元素对齐，且不会超出内边距（padding）的范围

一个父盒子里面的子盒子，如果其中一个子盒子有浮动，则其他子盒子都需要浮动，这样子盒子才能放在一排。

块级元素添加浮动float之后，就具有了行内块元素的特性（div的宽度随着文字的长度变化，根据文字多少自动撑开，类似于给文字加背景）。