使用flex实现一个自适应的九官格

css部分：

 *{ margin: 0; padding: 0; } .jiu { position: absolute; margin: 30px 60px; display: flex; width: 450px; height: 459px; background-color: burlywood; justify-content: space-between; flex-wrap: wrap; list-style: none; } .jiu li{ background-color:thistle; width: 33%; height: 33%; }

<ul > <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul>