11.9　综合实例

11.9　综合实例

请用本章所学的知识，完成图11-21所示表单页面的设计。

图11-21　综合实例表单页面

首先，完成HTML的结构内容部分：

（1）新建页面，在＜title＞标签中输入“综合实例——表单”作为页面标题；

（2）使用id为wrapper的div将所有元素包围起来；

（3）在该表单中，个人信息部分用fieldset装载；

（4）每个表单项由ul、li来组织；

（5）表单项左侧文字设为标签label。

HTML代码如下：

新建样式表文件“form.css”，在HTML的＜head＞标签中链接外部样式表：

在“form.css”中依次设置各部分样式：

（1）设置网页整体样式，将wrapper宽度设为600 px，并将其设为水平居中，代码如下：

（2）设置fieldset以及legend的样式；

（3）设置列表ul、li的间距及外观，代码如下：

（4）分别设置各个表单元素的样式，代码如下：