子元素是在父元素的内容区中排列的，如果子元素的大小超过了父元素，则子元素会从
父元素中溢出，使用overflow属性设置父元素如何处理溢出的子元素
可选值：visible 默认值，子元素会从父元素中溢出，在父元素外部的位置显示
hidden 溢出的内容将会被裁剪不会显示
scroll 生成两个滚动条，通过滚动条来查看完整的内容
auto 根据需要生成滚动条
额外俩个属性（了解）
overf-x
overf-y
父元素规定高度范围
.outer{background-color: chartreuse;height: 300px;}子元素小于父元素规定高度在父元素范围内
.inner{width:100px;height: 100px;background-color: blue;margin-bottom: 100px;}
若父元素没有规定高度，子元素撑开父元素高度（300px)
.outer{background-color: chartreuse;/* height: 500px; */}.inner{width:100px;height: 100px;background-color: blue;margin-bottom: 300px;}
完整代码
<!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>
.outer{background-color: chartreuse;/* height: 500px; */}.inner{width:100px;height: 100px;background-color: blue;margin-bottom: 300px;}</style>
</head>
<body><div class="outer"><div class="inner"></div><div class="inner"></div></div>
</body>
</html>
