html弹性布局平均分配,css3 flex布局实现平均分配元素的示例代码

本文主要介绍了css3 flex布局实现平均分配元素，给自己留个笔记，也分享给大家，具体如下：

例子一：

flex 布局

*{

padding:0;

margin:0;

}

body,html{

height: 100vh;

min-width: 800px;

}

.container{

display:flex;

flex-wrap:wrap;

display: -webkit-flex; /* safari */

}

.container>.item{

border: 1px solid black;

flex:1;

height:100px;

background: #abcdef;

}

例子二：

flex 布局

*{

padding:0;

margin:0;

box-sizing: border-box;

}

body,html{

width: 100%;

height: 100vh;

min-width: 800px;

display:flex;