Day 16

1月26日，临近过年，骑手人少了，单子也多了起来，好忙好忙好忙；继续看了一些《构建之法》；看了一些CSS知识点。

1. CSS盒模型简介
   CSS盒模型是CSS布局的基础，每个HTML元素都可以看作是一个矩形的盒子，这个盒子由内容（content）、内边距（padding）、边框（border）和外边距（margin）组成。
2. 盒模型的组成部分
   内容（Content）：盒子的实际内容，如文本、图片等。
   内边距（Padding）：内容与边框之间的空间。
   边框（Border）：围绕内容和内边距的边框。
   外边距（Margin）：盒子与其他元素之间的空间。

.box {
    width: 200px;
    height: 100px;
    padding: 10px;
    border: 5px solid black;
    margin: 20px;
}

3.布局相关属性
display属性：控制元素的显示方式，常见值有block、inline、inline-block、flex等。

.block {
    display: block;
}
.inline {
    display: inline;
}

float属性：使元素向左或向右浮动，常用于实现文字环绕图片的效果。

img {
    float: left;
    margin-right: 10px;
}

position属性：控制元素的定位方式，常见值有static、relative、absolute、fixed等。

.relative {
    position: relative;
    top: 10px;
    left: 20px;
}
.absolute {
    position: absolute;
    top: 50px;
    left: 100px;
}