《Dreamweaver CS3中文版实例教程 1CD 教学课件 ppt 吴教育习题答案 10章》由会员分享，可在线阅读，更多相关《Dreamweaver CS3中文版实例教程 1CD 教学课件 ppt 吴教育习题答案 10章（28页珍藏版）》请在金锄头文库上搜索。
1、第10章 使用表单使用表单 课堂练习星座查询网【练习知识要点】使用“表单”按钮插入表单。使用单选按钮组插入多个单选按钮效果，如图10-1所示。【效果所在位置】光盘/Ch10/效果/星座查询网/index.html。图10-110.4.1 插入表单（1）选择“文件 打开”命令，在弹出的对话框中选择“Ch10 clip 星座查询网 index.html”文件，单击“确定”按钮，效果如图10-2所示。 图10-2（2）将光标置入到单元格中，如图10-3所示，在“插入 表单”面板中单击“表单”按钮，如图10-4所示。 图10-3 图10-410.4.2 插入单选按钮组（1）将光标置入到表单中，如图10
2、-5所示，在“插入 表单”面板中单击“单选按钮组”按钮，在弹出的“单选按钮组”对话框中添加如图10-6所示的内容，单击“确定”按钮完成设置，效果如图10-7所示。 图10-5 图10-6图10-7 （2）选中表格，如图10-8所示，将“属性”面板“宽”选项设为100，如图10-9所示，效果如图10-10所示。 图10-8 图10-9 图10-10（3）保存文档，按键，预览效果如图10-11所示。图10-11 课堂练习会员登录页面【练习知识要点】使用“文本字段”按钮插入文本字段。使用“图像域”按钮插入图像域。效果如图10-12所示。【效果所在位置】光盘/Ch10/效果/会员登录页面/index.
3、html图10-1210.5.1 插入文本字段（1）选择“文件 打开”命令，在弹出的对话框中选择“Ch10 clip 会员登录页面 index.html”文件，单击“打开”按钮，效果如图10-13所示。（2）将光标置入到文字“用户用：”的后面，单击“插入 表单”面板中的“文本字段”按钮，在文字的后面插入文本字段，如图10-14所示。 图10-13 图10-14(3) 选中文字后面的文本字段，在“属性”面板中将“字符宽度”选项设为15，“最多字符数”选项设为6，如图10-15所示，效果如图10-16所示。 图10-15 图10-16（4）将光标置入到文字“用户用：”的后面，单击“插入 表单”面板
4、中的“文本字段”按钮，在文字的后面插入文本字段，如图10-17所示。图10-17（5）选中文字后面的文本字段，在“属性”面板中将“字符宽度”选项设为20，“最多字符数”选项设为12，如图10-18所示，效果如图10-19所示。 图10-18 图10-1910.5.2 插入图像域（1）将光标置入到单元格中，如图10-20所示。单击“插入 表单”面板中的“图像域”按钮，在弹出的“选择图像源文件”对话框中选择光盘目录下“Ch10 clip 会员登录页面 images”文件夹中的“index_13.jpg”，如图10-21所示，单击“确定”按钮完成图片的插入，效果如图10-22所示。 图10-20 图
5、10-21图10-22（2）使用相同的方法插入图片“index_14.jpg”，效果如图10-23所示。图10-23（3）保存文档，按键预览效果，如图10-24所示。图10-24 课后习题订购单【习题知识要点】使用“文本字段”按钮、“列表/菜单”按钮、单选按钮、复选框及提交按钮制作订购单效果，如图10-25所示。【效果所在位置】光盘/Ch10/效果/订购单/index.html。图10-2510.6.1 插入表格和图片（1）选择“文件 打开”命令，在弹出的对话框中选择“Ch10 clip 订购单 index.html”文件，单击“打开”按钮，效果如图10-26所示。（2）将鼠标置入到单元格中，
6、如图10-27所示。在“插入 常用”面板中单击“表格”按钮，在弹出的“表格”对话框中进行设置，如图10-28所示，单击“确定”按钮，效果如图10-29所示。 图10-26 图10-27 图10-28 图10-29（4）将鼠标置入到第1行中，在“插入 常用”面板中单击“表格”按钮，在弹出的“表格”对话框中进行设置，如图10-30所示，单击“确定”按钮，在“属性”面板中选择“水平”选项下拉列表中的“右对齐”，效果如图10-31所示。 图10-30 图10-31（5）将鼠标置入到第1列中，在“插入 常用”面板中单击“图像”按钮，在弹出的“选择图像源文件”对话框中选择光盘目录下“Ch10 clip 订
7、购单 images”文件夹中的“img_03.jpg”，如图10-32所示，单击“确定”按钮，效果如图10-33所示。 图10-32 图10-33（6）用相同的方法将“img_05.jpg”插入到第3列中，效果如图10-34所示。将鼠标置入到第2列中，在“属性”面板中，将“宽”选项设为185，“背景颜色”设为灰色（#EEEEF0），如图10-35所示，效果如图10-36所示。 图10-34 图10-35 图10-3610.6.2 设置表格（1）在第2列中输入文字，如图10-37所示。在“插入 表单”面板中单击“文本字段”按钮，在文字的后面插入文本字段，如图10-38所示。 图10-37 图10
8、-38（2）选中文字后面的文本字段，在“属性”面板中将“字符宽度”选项设为10，如图10-39所示，效果如图10-40所示。 图10-39 图10-40（3）将鼠标置入到第2行中，在“属性”面板中，将“高”选项设为44，如图10-41所示。将鼠标置入到第3行中，在“插入 常用”面板中单击“表格”按钮，在弹出的“表格”对话框中进行设置，如图10-42所示，单击“确定”按钮，效果如图10-43所示。 图10-41 图10-42 图10-43（4）将鼠标置入到第2列中，在“插入 常用”面板中单击“图像”按钮，在弹出的“选择图像源文件”对话框中选择光盘目录下“Ch10 clip 订购单 images”
9、文件夹中的“img_09.jpg”，如图10-44所示，单击“确定”按钮，效果如图10-45所示。 图10-44 图10-45（5）将鼠标置入到第2列中，在“属性”面板中，将“宽”选项设为64，如图10-46所示。（6）将鼠标置入到第3列中，在“属性”面板中，将“宽”选项设为220，如图10-47所示，效果如图10-48所示。 图10-46 图10-47 图10-48（7）在第3列单元格中输入文字，并单击“属性”面板中的“加粗”按钮，效果如图10-49所示。（8）将鼠标置入到第4行，在“属性”面板“高”选项设为10，如图10-50所示，在“拆分”视图窗口中选中该单元格的“ ”标签，如
10、图10-51所示，按“Delete”键，删除该标签，效果如图10-52所示。 图10-49 图10-50 图10-51 图10-52（9）将光标置入到单元格中，如图10-53所示，在“插入 常用”面板中单击“表格”按钮，在弹出的“表格”对话框中进行设置，如图10-54所示，单击“确定”按钮，在“属性”面板中选择“对齐”选项下拉列表中的“居中对齐”，效果如图10-55所示，。（10）分别将第2行、第4行、第6行的单元格合并，效果如图10-56所示。 图10-53 图10-54 图10-55 图10-56（11）将鼠标置入到第1行第1列中，在“属性”面板“水平”选项的下拉列表中选择“居中对齐”，“
11、垂直”选项的下拉列表中选择“居中”，将“宽”选项设为116，“高”选项设为44，如图10-57所示。用相同的方法，将第2列“宽”选项设为12，第3列“宽”选项设为572，效果如图10-58所示。 图10-57 图10-58（12）将鼠标置入到第1行第1列中，在“属性”面板中单击“背景”选项右侧的“浏览文件”按钮，弹出“选择图像源文件”对话框，在光盘目录下的“Ch10 clip 订购单 images”文件夹中选择图片“img_12.jpg”，单击“确定”按钮，为单元格添加背景图像，效果如图10-59所示。图10-59（13）将鼠标置入到第2行中，在“属性”面板中选择“水平”选项下拉列表中的“右对
12、齐”，在“插入/常用”面板中单击“表格”按钮，在弹出的“表格”对话框中进行设置，如图10-60所示，单击“确定”按钮，效果如图10-61所示。 图10-60 图10-61（14）将鼠标置入到单元格中，在“属性”面板中单击“背景”选项右侧的“浏览文件”按钮，弹出“选择图像源文件”对话框，在光盘目录下的“Ch10 clip 订购单 images”文件夹中选择图片“img_26.jpgf”，单击“确定”按钮，为单元格添加背景图像，效果如图10-62所示。图10-62（15）将“属性”面板“高”选项设为3，如图10-63所示，在“拆分”视图窗口中选中该单元格的“ ”标签，如图10-4所示，按Delete键，删除该标签。 图10-63 图10-64（16）用相同的方法制作其他单元格，效果如图10-65所示。将鼠标置入到第7行第1列中，在“属性”面板中将“水平”选
