第14章使用AP元素.ppt

Chapter14使用AP元素 知识点 AP元素的创建与编辑使用AP元素排版AP元素上的行为 14 1AP元素的创建与编辑 新建文件 并将 插入 工具栏切换到 布局 插入工具栏面板 然后单击其中的 绘制APdiv 按钮 此时的鼠标指针将变成十字形 在文档中按住鼠标并拖动就会画出一个矩形的层 如图14 1所示 14 1 1AP元素的创建 14 1AP元素的创建与编辑 1 调整AP元素的大小如图14 2所示 2 移动层如图14 3所示 14 1 2AP元素的调整与移动 14 1AP元素的创建与编辑 将光标放在AP元素中 就可以在AP元素中插入文字 图像 表格等对象 插入的方法和在网页中完全相同 14 1 3在AP元素中添加内容 14 1AP元素的创建与编辑 使用菜单命令具体操作步骤如下 将光标放置在AP元素中 然后选择菜单命令 插入记录 布局对象 APDiv 如图14 4所示 14 1 4创建嵌套AP元素 14 1AP元素的创建与编辑 使用Dreamweaver中的 AP元素 面板可以对层进行全面管理 选择菜单命令 窗口 AP元素 此时将打开 AP元素 面板 其中显示的是当前文档中所有的层 如图14 6所示 14 1 5 AP元素 面板 14 1AP元素的创建与编辑 选中AP元素后 在 属性 面板上就可以显示该AP元素的属性 如图14 14所示 14 1 6AP元素的属性 14 2使用AP元素排版 选择 窗口 AP元素 命令打开 AP元素 面板 然后选中 AP元素 面板上的 防止重叠 复选框 如图14 15所示 14 2 1防止重叠 14 2使用AP元素排版 绘制AP元素后最好将相关的AP元素对齐 1 选中要对齐的AP元素 按住Shift键的同时 在 AP元素 面板上连续单击选中要参与对齐的AP元素的名称 2 然后在编辑窗口下选择菜单命令 修改 排列顺序 左对齐 如图14 16所示 14 2 2AP元素的对齐 14 2使用AP元素排版 14 2 2AP元素的对齐 3 此时选中的AP元素按照AP元素的左侧边缘对齐 其他的以此类推 14 2使用AP元素排版 14 2 3AP元素转换为表格 使用AP元素排版结束之后 要将AP元素排版转换为表格排版 1 选择 修改 转换 将APDiv转换为表格 命令 此时将打开 将APDiv转换为表格 对话框 如图14 17所示 2 设定完毕后单击 确定 按钮 此时AP元素将会被转换为表格 14 3AP元素上的行为 14 3 1拖动AP元素 打开 行为 面板 单击面板上的 添加行为 按钮 在展开的菜单中选择 拖动AP元素 命令 此时打开的对话框中有两个选项卡 其中的 基本 选项卡如图14 18所示 14 3AP元素上的行为 14 3 2显示和隐藏AP元素 课堂练习14 2显示和隐藏AP元素效果1 新建文件 然后在网页上插入3个AP元素 将它们的 CSS P元素 分别设为apDiv1 apDiv2 apDiv3 并分别设定背景色为红色 绿色 蓝色 如图14 23所示 2 在文档中插入两个表单按钮 在 属性 面板上分别设定按钮的标签为 隐藏 和 显示 此时的按钮如图14 24所示 14 3AP元素上的行为 14 3 2显示和隐藏AP元素 14 3AP元素上的行为 14 3 2显示和隐藏AP元素 3 选中 隐藏 按钮 然后在 行为 面板中单击 添加行为 按钮 在展开的菜单中选择 显示 隐藏元素 将打开 显示 隐藏元素 对话框 如图14 25所示 4 选中要隐藏或显示的AP元素 然后单击 显示 隐藏 默认 按钮中的一个 其中 显示 按钮用来让AP元素显示出来 如图14 26所示 14 3AP元素上的行为 14 3 2显示和隐藏AP元素 14 3AP元素上的行为 14 3 2显示和隐藏AP元素 5 单击 确定 按钮关闭对话框 6 再选中 显示 按钮 然后打开 显示 隐藏元素 对话框 在其中设定所有的AP元素为显示状态 如图14 27所示 14 3AP元素上的行为 14 3 2显示和隐藏AP元素 7 单击 确定