123

**1.实验截图**

![实验楼](https://dn-simplecloud.shiyanlou.com/2969131480150522115-wm) ![实验楼](https://dn-simplecloud.shiyanlou.com/2969131480150551241-wm) ![实验楼](https://dn-simplecloud.shiyanlou.com/2969131480150561502-wm)

**2.实验代码**

html代码： ``` 123

topcenter

middle1

middle2

bottom

```

css代码： ``` .container{height:560px;width:100%;background-color:black} #top{height:50px;width:100%;text-align:left;background-color:steelblue;} #topcenter{height:50px;width:80%;text-align:center;margin:0px 100px;background-color:cadetblue;} #middle{height:450px;background-color:darkgray} #middle1{height:150px;width:80%;margin:10px 100px 0px 100px;text-align:center;background-color:cadetblue;float:left} #middle2{height:50px;width:80%;margin:30px 100px 210px 100px;text-align:center;background-color:blue;float:left} #bottom{margin:10px 100px 0px 100px;text-align:center;background-color:darkslategrey;height:50px;width:80%;float:left} .font1{color:white} ```

**3.实验体会**

一个网页基本上都是由一个个盒子组成的，css盒子的运用在一个网页中非常重要。

“网页制作[人文素质选修课]”实验报告