CSS实现子div居中置底

在采用Div+CSS布局的网页中，可通过绝对定位（position: absolute）使Div元素水平居中并垂直居底。以下将通过具体示例进行说明。

1、 新建名为test.html的HTML文件，演示如何通过CSS实现子div在父div内水平居中且垂直靠底的布局效果。

2、 在test.html中，用div标签创建两个相互嵌套的div元素。

3、 为两个div元素分别添加class属性，值设为con和bot，以便后续通过CSS进行样式定义与控制。

4、 在test.html文件的style标签中，为class属性值为con的div元素定义CSS样式：将其宽度设为800像素，高度设为1000像素，背景色设为纯黑色，并通过设置左右外边距为auto、上下外边距为0，实现该元素在页面中水平居中显示。

5、 在test.html文件的

6、 为类名为bot的div元素应用CSS样式，使其固定于页面底部并水平居中。具体做法是：设置position为absolute，bottom为0，left为50%，再通过margin-left负值（-100px）向左微调，确保元素中心与视口中心对齐。

7、 在浏览器中打开test.html，即可看到div元素已实现垂直居中并底部对齐的效果。

8、 新建一个名为test.html的文件。

9、 使用div进行嵌套布局

10、 为两个div设置CSS样式，内层div采用绝对定位，使其固定显示在页面底部中央位置。