在学习前端开发的过程中，div的css布局是一个不可避免的话题。下面我们简单介绍一下div css布局的入门知识。

首先，我们要明确一个概念：div是html中的一个元素，它可以用来划分网页中的区域，也可以被用来作为容器来放置其他html元素。css布局则是为这些div元素赋予样式，使得这些元素呈现出我们想要的布局效果。

<div class="container">
<div class="header">这是头部</div>
<div class="content">这是内容</div>
<div class="footer">这是底部</div>
</div>

上述代码演示了一个简单的html文档结构，其中container、header、content和footer都是div元素，它们的class属性分别为container、header、content和footer。

接下来我们可以为这些元素定义样式：

.container {
width: 980px;
margin: 0 auto;
}
.header {
height: 80px;
background-color: #333;
color: #fff;
text-align: center;
line-height: 80px;
}
.content {
height: 500px;
background-color: #f1f1f1;
text-align: center;
font-size: 18px;
line-height: 500px;
}
.footer {
height: 100px;
background-color: #333;
color: #fff;
text-align: center;
line-height: 100px;
}

上述代码定义了container的宽度和居中对齐；header和footer的高度、背景颜色、文字颜色、文字居中、行高；content的高度、背景颜色、文字居中、字体大小和行高。

以上就是一个简单的div css布局示例。通过对div元素的分区和样式的定义，可以轻松地实现html页面的布局。当然，这只是入门级别的示例，对于更复杂的布局，我们需要深入学习并运用更多的css属性和技巧。