css学习笔记

弹性盒子

我们继续开始flex弹性盒子的讲解,flex弹性盒子是提供新的功能,是在原来盒模型基础上，所有他提供的功能和盒模型不上一个维度…
flex他的功能有点想bfc（当div触发bfc，他里面的渲染规则就会发生改变,能改变当前元素的渲染规则）

当给一个元素设置display:flex 这个元素就变成具备弹性盒子的功能区域.在元素里面就可以使用弹性盒子的功能父级给一个弹性盒子的区域,字级可以使用弹性盒子的功能方法，这俩人可以使用它的功能方法,这俩人配合使用,

---

弹性容器通过设置 display 属性的值为 flex 或 inline-flex将其定义为弹性容器。

	*{
	marigin:0;
	padding:0
	}
	.wrapper{
		width:300px;
		height:300px
		border:1px solid black;
		display:flex/inline-flex
	}

	.content{
	width:100px
	height:100px
	border:1px solid green
	box-sizing: border-box
	}

	<div class='wrapper'>
		<div class='content'></div>
		<div class='content'></div>
		<div class='content'></div>
	</div>