Dreamweaver网页制作（第3版）全套PPT课件.pptx

;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;模块三 网页布局;本章任务;知识细目二;知识细目二;3.1 表格布局;3.1 表格布局;;提示;3）选择表格元素;3）选择表格元素;选择单个 单元格;4） 设置表格属性;·“边框”：指定表格边框的宽度，单位为像素。 ·“背景图像”：设置表格的背景图像。 ·“背景颜色”：设置表格的背景颜色。 ·“清除列宽”按钮：从表格中删除所有明确指定的列宽。 ·“清除行高”按钮：从表格中删除所有明确指定的行高。 ·“将表格宽度转换成像素”按钮：将表格中每列的宽度设置为以像素为单位的当前宽度，同时将整个表格的宽度设置为以像素为单位的当前宽度。 ·“将表格宽度转换成百分比”按钮：将表格中每列的宽度设置为按百分比表示的宽度，同时将整个表格的宽度设置为按百分比表示的宽度。;单元格属性的设置;表格格式设置优先顺序 ;5）表格的基本操作;提示;（3）插入行或列 选中行或列，选择菜单“修改→表格”子菜单中的“插入行”或“插入列”命令或直接在其上单击鼠标右键，从弹出的快捷菜单中选择对应的命令，可在所选行的上方插入一新行或所选列的左方插入一新列。 选中行或列，选择菜单“修改→表格→插入行或列”命令，弹出“插入行或列”对话框，设置插入的行（列）数及位置，单击“确定”按钮，可以插入多行或多列。 选中行或列，单击“插入”面板“布局”类别中的相应插入行或插入列按钮，可以在选中行或列的指定位置插入新行或新列。;;;提示;3.1 表格布局; 框架技术是设计网页时经常用到的一种布局技术，它主要通过框架集(Frameset)和框架(Frames)两种元素来实现。一个框架就是一个区域，可以用来单独打开一个HTML文档。多个框架可以把浏览器窗口划分为若干个区域，每个区域显示不同的网页文档，多个框架的集合就是框架集。;1）创建框架集 （1）打开需要应用预定义框架集的文档，选择菜单“插入→HTML→框架”子菜单中的相应命令，指定预定义的框架集，弹出“框架标签辅助功能属性”对话框，，保持默认设置，单击“确定”按钮， Dreamweaver 将自动设置所选择的框架集。;（2）创建自定义框架集，一般可以通过以下方法对预设框架集进行修改完成。 ①在框架集中增加新框架 将鼠标指针移到框架四周的边缘处，当鼠标指针呈双向箭头时，拖动鼠标可在水平或垂直方向增加一个框架，当鼠标移到框架的四个顶角，呈箭头时，拖动鼠标可以在水平和垂直方向同时增加框架。 ②调整框架的大小 用鼠标直接拖动边框线，可以调整框架的大小。 ③删除不需要的框架 用鼠标拖动框架边框到相对应的外边框上即可将其删除。如果要删除框架中的文档有未保存的内容，Dreamweaver CS6将提示保存该文档。 ④拆分框架 选中要拆分的框架，在按下【Alt】键的同时用鼠标拖动边框进行拆分。 将光标定位到需要拆分的框架中，选择菜单“修改→框架集”子菜单中的相应命令， ;2)选择框架和框架集 ;;3)设置框架(集)的属性 ; 在“框架”面板中，单击某框架的内部即可选中该框架，打开“框架”属性面板，如下图所示。 ;4)向框架中添加内容 （1）直接在框架中添加内容 将光标定位到框架中，此时可以添加文本、图像、表格等页面元素，即创建一个新的网页文件。选择菜单“文件→保存框架”命令可将该网页文件进行保存。 提示 在向框架中输入内容之前，可选择菜单“修改→页面属性”命令，通过打开的“页面属性”对话框对所选框架进行页面属性设置。 （2）在框架中打开已有的网页文件 ①执行以下操作之一，打开“选择HTML文件”对话框。 选择一个框架，在“框架”属性面板中单击“源文件”后的“浏览文件”按钮。 将光标定位到框架中，选择菜单“文件→在框架中打开”命令。 将光标定位到框架中，按【Ctrl+Shift+O】组合键。 ②在对话框中选择要打开的网页文件，单击“确定”按钮。;5）保存框架 ;6）创建框架中的链接;（2）创建框架中的链接 ①在“设计”视图中，选择要进行链接的对象，如文本或图像。 ②在属性面板的“链接”文本框中指定要链接的目标文件。 ③在属性面板的“目标”列表框中，选择相应的项，如图所示，指定链接文档打开的窗口或框架窗口。;7）创建浮动框架网页 使用浮动框架，可以在不改变原来网页结构的基础上再添加其它网页的内容，实现页中页结构，具体操作步骤如下。 （1）在已打开的文档中，将光标定位到要插入其它网页的位置。 （2）选择菜单“插入→标签”命令，打开“标签选择器”对话框，在左边栏选择“HTML标签”中的“网页元素”，在右边栏选择iframe，单击“插入”按钮