![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
天蓬老师Correction status：qualified
Teacher's comments：学习布局一定要搞清一点, 就是自定义布局,一定要破坏掉原始的文档流布局才可以, 布局的第一步就是要从文档中获取到可以自己控制的元素, 换句话说 , 就是从浏览器手中接管元素的布局权利...
Collection
Collection
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>align-items</title><style>.box {border: 2px dashed red;display: flex;/*水平居中对齐*/align-items: center;}.item {border: 1px solid black;min-height: 50px;flex: auto;}.item:first-of-type {min-height: 150px;}</style></head><body><div class="box"><span class="item">One</span><span class="item">Two</span><span class="item">Three</span></div></body></html>
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>flex-direction</title><style>div:not(.box) {background-color: lightblue;border: 1px solid gray;margin-right: 5px;}.box {border: 2px dashed red;display: flex;/*默认的水平方向排列*/flex-direction: row;/*交换行轴的起点*//*flex-direction: row-reverse;*//*交换主轴与交叉轴,顺序不变*//*flex-direction: column;*//*交换主轴与交叉轴,元素顺序变反*/flex-direction: column-reverse;}</style></head><body><div class="box"><div>One</div><div>Two</div><div>Three<br>has<br>extra<br>text</div></div></body></html>
使用传统的定位，可以把元素的位置准确的放在需要的位置，但是想放到自己想要的位置，步骤有点繁琐，有时候一个设置的不合适就容易出现偏差。我做的时候，一开始位置总是放不对，后来改了好几个属性，才改了回来，感觉一旦出错，改起来好烦。或许可能大概应该是我对定位不太熟悉，我会以后有时间多熟悉熟悉的。
天蓬老师
