揭秘CSS(第 1 版)
9.3.3 弹性容器的属性
阅读(

align-content:center 效果演示

align-content

属性取值:







HTML代码:

<div class="father">
 <div class="box1">1</div>
 <div class="box2">2</div>
 <div class="box3">3</div>
 <div class="box1">4</div>
 <div class="box1">5</div>
</div>

CSS代码:

.father  {
	color: #fff;
	text-align: center;
	font: bold 36px/36px monaco;
	border: 1px solid #ef39d5;
}

.father  {
	width: 220px;
	height: 200px;
	display: flex;
	flex-wrap: wrap;
	align-content: center;
}

.father > div  {
	width: 100px;
}
	
.box1  {
	background: #7f3ffd;
}

.box2  {
	background: #ef39d5;
}

.box3  {
	background: #1bb9f1;
}

运行效果:

1
2
3
4
5
← 键盘方向键翻页 →
返回顶部 手机访问 关注微信 返回底部

扫码访问歪脖网

随时随地,想看就看

关注歪脖网微信

分享 web 知识、交流 web 经验