html,
body { height: 100%padding: 0margin: 0}
.mother { height: 100%padding: 100px 0 0box-sizing: border-box }
.A { height: 100pxmargin: -100px 0 0background: #BBE8F2}
.B { height: 100%background: #D9C666}
<div class="mother">
<div class="A">头部DIV</div>
<div class="B">下部DIV</div>
</div>
代码效果
你可以看下效果，望采纳。
CSS设置div边框颜色宽度和高度步骤如下：
1、新建一个html文件，创建一个类名为wrap的div。
2、先通过css类选择器选择到div来控制div的宽度和高度和背景颜色（没有边框时方便看出来div的大小）。
3、通过div 的border属性控制边框颜色，设置border的宽度为2px，线型为实线，颜色为蓝色。
4、这样就可以设置div边框颜色宽度和高度，如下图：
扩展资料：
css border属性：
border 简写属性在一个声明设置所有的边框属性。
可以按顺序设置如下属性：
border-width，border-style，border-color
如果不设置其中的某个值，也不会出问题，比如 border:solid #ff0000也是允许的。
IE6下默认的字体尺寸大致在 12 - 14px 之间。
强制定义该 div 的字体尺寸<div id="test1" style=" background-color:#FFCCCCwidth:400pxclear:bothfont-size:0"></div>。
<html>
<head>
<style>
#container{height:100%border:solid 1px redwidth:100%}
#top{margin-top:1pxheight:80pxborder:solid 1px green}
#down{margin-top:1pxheight:89%border:solid 1px silver}
#left{height:100%border:solid 1px blackmargin:1pxwidth:200pxfloat:left}
#right{border:solid 1px #0aamargin:1pxheight:100pxwidth:40px}
</style>
</head>
<body>
<table id='container'>
<tr><td>
<div id='top'></div>
<div id='down'>
<div id='left'></div>
<div id='right'>canHaveHTML 获取表明对象是否可以包含丰富的 HTML 标签的值。
扩展资料：
<div>标签定义 HTML 文档中的分隔（DIVision）或部分（section）。div属于web前端的学习内容，其中<div>标签常用于组合块级元素，以便通过样式表来对这些元素进行格式化。<div>可定义文档中的分区或节（division/section）。
<div>标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。
参考资料来源：百度百科-DIV
