CSS实现div自适应网页大小

通过CSS将div宽度设为百分比，可使其随网页尺寸变化自动调整大小。具体实现方法如下示例所示。

1、 创建一个名为test.html的文件，通过该文件演示如何利用CSS使div元素随网页尺寸变化而自适应调整大小。

2、 在test.html中，通过CSS重置body与div的内外边距，具体代码如下所示。

3、 在test.html页面中，新建一个div用于包裹内部元素，并为其设置class属性值为con。

4、 在test.html中，将class为con的div设置宽度100%，使其充满整个页面，并通过CSS实现该div内容居中对齐显示。

5、 在 test.html 页面中，于 class 为 con 的 div 内部，创建三个子 div，其 class 分别设置为 con1、con2 和 con3。

6、 在test.html中，用CSS统一设置所有div左浮动且高度300px，同时分别为每个div设定不同的背景色和宽度。

7、 为使div随网页尺寸自适应，内部所有div的宽度总和应恰好占满父容器的100%。

8、 打开浏览器中的test.html文件，调整窗口尺寸，可观察到页面中div元素的大小随之动态变化。