用flex布局实现左右两边对齐

有这样的需求,文字左对齐,button右对齐。我们就可以用flex布局很好的实现此需求。

用flex布局实现左右两边对齐_第1张图片

代码如下:




    




关键的css代码如下:

display: flex;
flex-wrap: wrap; //单独成行或列
justify-content: flex-end //项目位于容器的结尾。

在项目没有占满一行,而且要左对齐的时候,我们用Div进行包裹就可以了。

 

 

你可能感兴趣的:(CSS)