![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
天蓬老师Correction status：qualified
Teacher's comments：这些基础知识 , 千万要重视, 有许多同学, 总认为能写出来就OK,上来就写页面,不看重基础知识 , 出了问题, 不知如何分析....
Collection
Collection
初步了解flex容器的属性与功能
flex容器的六个属性与功能：](https://img.php.cn/upload/image/247/741/225/1577641059796364.jpg)
flex容器属性案例：
代码段：
<!DOCTYPE html><html><head><mate charset="UTF-8"><title>flex术语</title><style>.container {height : 300px;width : 50%;border : 1px dashed;box-sizing : border-box;background-color : red;}.item {width : 200px;height : 50px;border : 1px dashed;box-sizing : border-box;background-color : wheat;}.container {display : flex;}.container {flex-direction : row;flex-wrap : wrap;justify-content : flex-end;justify-content: space-around;align-items: flex-start;align-content: space-around;}</style></head><body><div class="container"><span class="item">1</span><span class="item">2</span><span class="item">3</span><span class="item">4</span><span class="item">5</span><span class="item">6</span><span class="item">7</span><span class="item">8</span></div></body></html>
效果图：
12月20日作业分析：
单个知识点都已经掌握了，但是不能灵活运用，独立完成一个页面时不知如何下手，还需要多加练习才能彻底掌握基本的页面开发套路
天蓬老师