![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
WJCorrection status：qualified
Teacher's comments：总得来说写的不错，最好加上效果图！
Collection
Collection
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.box {width: 300px;height: 300px;background-color: aqua;/* padding属性是盒子的内容区到padding的间距，在效果图中书背景颜色到边框线的那一部分空白 */padding: 10px;/* 设置盒子的边框，边框宽度为3px，实线，背景颜色为黑色 */border: 3px solid #666;/* 裁切背景颜色，因为背景颜色会自动从内容区扩散到padding，为了方便查看内容区大小，将内容区背景与padding裁切 */background-clip: content-box;/* position是定位属性,默认的值是static,如果随意添加一个值,static除外,那么这个元素就是定位元素 *//* position: relative;是相对定位,是根据元素本身的位置进行移动,并且不释放文档流中的空间 */position: relative;/* 根据原来的位置像右偏移50px */left: 60px;}.box-one {padding: 10px;width: 300px;height: 300px;background-color: blue;background-clip: content-box;border: 3px solid #666;/* margin指的是一个容器(可以理解为盒子)之间与另一个容器的间距，margin一共是有4个值，上右下左按照顺时针进行值的设定 *//* margin-top,margin-right,margin-bottom,margin-left这四个属性分别对应了与上右下左的间距 */margin: 10px;/* box-sizing重新计算盒子的大小,默认的值是content-box代表了计算到内容区,如果为默认值一旦设置的值添加了padding的话,那么整个盒子的真实大小将会改变.会破坏布局. *//* border-box是将盒子的宽高计算到边框,如果盒子宽高的值重新设定,那么整个内容区也会跟着变大变小,而盒子的大小不变. */box-sizing: border-box;}.box-tow {width: 150px;height: 120px;background-color: red;/* position: absolute;是相对定位,根据定位父元素来进移动,如无腹肌定位元素将默认body为定位父级 */position: absolute;}</style></head><body><div class="box"><div class="box-tow"></div></div><div class="box-one"></div></body></html>