admin 管理员组

文章数量: 1086019


2024年5月26日发(作者：输入框html怎么写)

《网页设计与制作》 实验报告

实验六 CSS布局

学号 201114004 姓名 王渝迪 专业 计算机科学与技术 成绩

【实验目的】

掌握用CSS的布局。

【实验内容】

1、熟悉Dreamweaver软件的环境；

2、会使用CSS进行布局。

【实验步骤】

1. 打开Dreamweaver，新建HTML文件。在代码中body中插入一个DIV标签。然后选择标签，新

建CSS规则，在新建的CSS规则中，对新建的规则进行设置。

2. 对背景项设置，可以设置背景色；对方框项设置，可以设置标签的宽，高，和浮动（左对齐，右

对齐，居中，无），以及方框位置的Padding和Margin进行设置；对边框设置，设置它的类型、宽

度和颜色。这是一栏布局。

3. 二栏布局是在一栏布局的基础上再新建一个DIV标签。对新建的标签进行同样的设置，在设置方

框的浮动时，选择不同的浮动，会出现不同的效果，如一个DIV标签设置为左对齐，另一个设为

右对齐。这种效果还可以通过所建规则中的定位进行设置。

4. 嵌套布局。将第三个div嵌套在另一个div中。

【实验结果】

第1页 共2页

《网页设计与制作》 实验报告

【实验心得和体会】

通过本次的实验，我熟练掌握了div布局技巧。能够完成简单的css+div布局。如上图。现在网

页设计过程中基本都是使用css+div的格式进行布局。学会css+div对于网页设计来说有很重要的意义。

第2页 共2页


本文标签： 设置 实验 进行 布局 新建

版权声明：本文标题：css+div布局(实验报告) 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://roclinux.cn/b/1716727241a696303.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。