在flex布局中，子元素的属性代码写在父盒子里面，并且flex布局中任何元素都可以设置大小；居中的思路就是分清楚主轴justify-content和侧轴align-items，都设置为center即可，代码如下：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>flex居中</title><style>div {display: flex;height: 600px;width: 600px;background-color: green;/* flex属性写在父盒子里面 *//* 主轴居中 */justify-content: center;/* 侧轴剧中 */align-items: center;}span {height: 200px;width: 200px;background-color: tomato;}</style></head><body><div><span></span></div></body></html>
