![[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
默写盒模型的全部属性,并准确说出他们的应用场景
margin属性：适用于两个同级盒子模型之间的间距，在嵌套盒子时使用auto属性可用让子盒子居中；
padding属性：适用于盒子内border与内容content之间间距，以及在嵌套盒子时父盒子作为子盒子的外间距使用；
border属性：是盒子的边框，用来设置盒子边框的颜色、粗细、样式等。
box-sizing: 解决了什么问题, 不用它应该如何处理
box-sizing解决了盒子因内边距、线框撑开时改变了盒子的大小，如果不用box-sizing时，我们在给盒子添加内边距和线框时需要把内边距padding和线框border分上下、左右计算到盒子的长宽中，来设置盒子中内容content的长宽。
盒子外边距之的合并是怎么回事,并实例演示
盒子的外边距合并指的是两个同级盒子的外边距，会只显示外边距值大的盒子的值，而不是两个盒子值的和，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.box1 {margin: 20px;padding:20px;border:1px green solid;background-color: yellow;width: 50px;height: 55px;}
.box2 {margin:30px;border: 2px red solid;background-color: #1E9FFF;width: 40px;height: 35px;}
</style>
</head>
<body>
<div class="box1"></div>
<div class="box2"></div>
</body>
</html>点击 "运行实例" 按钮查看在线实例
嵌套盒子之间内边距与外边距的表现有何不同, 如何处理
嵌套盒子之间，盒子的内边距不受影响，但是子盒子的外边距会传递给父盒子，如果想要给子盒子添加外边距，可以在父盒子中设置内边距padding来达到效果，同时子盒子外边距设置auto属性，可以达到在父盒子中居中的目的。
实例演示: 背景颜色的线性渐变的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.box1 {margin: 20px;
border:1px green solid;
width: 500px;
height: 550px;
background: linear-gradient(to right,yellow,blue);}
</style>
</head>
<body>
<div class="box1"></div>
</body>
</html>点击 "运行实例" 按钮查看在线实例
这例演示: 背景图片的大小与位置的设定
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.box1 {margin: 20px;
border:1px green solid;
width: 500px;
height: 550px;
background: url("https://img.php.cn/upload/course/000/000/001/5d9f0b79ad447136.jpg") no-repeat center;}
</style>
</head>
<body>
<div class="box1"></div>
</body>
</html>点击 "运行实例" 按钮查看在线实例