网页课件第7章

1、第7章Dreamweaver的基本应用程序、2020/7/24、D F ff、 本章知识技能要点： Dreamweaver中各控制屏的角色站点的创建和管理页的各属性及其设置方法网页中的文本的格式化方法在Dreamweaver中创建超级网络链接的方法在网页中创建导航仪表栏7.1第一次使用Dreamweaver 知道了，7.1.1 Dreamweaver概要Dreamweaver是Macromedia公司发表的专业网站开发流程。 是一个专门的HTML编辑器，用于对网站、网页和Web应用程序进行设置、查询密码和开发。 Dreamweaver为用户提供了一个方便的工具，无论是在手工作业中创建HTML查

2、询密码，还是在可视编辑环境中工作，都可以获得更完美的Web创作体验。 例如，是第一个利用最新一代浏览器性能的Web开发计程仪计划，开发者可以方便地利用级联反应样式表和动态HTML等高级功能。 7.1第一个Dreamweaver和Dreamweaver 8包括许多新功能，用户可以用最少的时间和精力生成网站和应用程序。 Dreamweaver 8的主要新功能包括： 缩放工具和向导可视化XML数据绑定新的CSS样式面板CSS版结构的可视化查询密码折叠在“编码”工具条舞台上发送“插入Flash网络视频”命令，7.1第一次识别Dreamweaver，7.1。 在此画面中，可以选择与Dreamweaver

3、 8的各种网站数据库方法。 Dreamweaver 8首选项，7.1.2.1 inclusion工具条插入栏包含用于将各种类型的对象(如图像、表格和层)插入到文档的按钮。 插入时可以设定不同的属性。 将鼠标指针滚动到按钮上，将显示包含按钮名称的工具提示。 例如，可以通过喀呖声“插入”栏中的“表格”按钮来插入表格。 也可以不使用“插入”栏，而使用“插入”菜单插入对象。 7.1.2.2标准工具条标准工具条包含用于文档的基本操作命令，如“新建”、“存储”、“剪切”、“复制”、“粘贴”、“撤消”和“重做”。 7.1.2.3文档工具条中的文档工具条包括视图切换按钮，用于在查询密码视图、设计视图以及在云同

4、步上显示查询密码视图和设计视图的分割视图之间快速切换。 该工具条还包含与查看文档、在本地站点和远程站点之间传输文档相关的常规命令和选项。 7.1.2.4“文档”窗口“文档”窗口显示当前创建和编辑的web文档。 7.1.2.5专业技术腻子粉检查器“专业技术腻子粉检查器”是用于查看和修改当前所选对象或文本的各种专业技术腻子粉的有用面板。 在编辑网页时，“专业技术腻子粉”检查器会自动为在“文档”窗口中编辑的对象提供该对象的每个专业技术腻子粉。 7.1.2.6文件面板“文件”面板用于管理当前站点的文件和文件夹，无论它们是Dreamweaver站点的一部分还是位于远程服务器上。 您也可以使用“文件”面板

5、网站数据库到本地磁盘上的所有文件。 这看起来像是Windows的快速支重轮，使用方法非常相似。 7.1.2.7状态栏显示有关要创建的文档的附加信息。 7.1.2.8面板组“面板组”是位于某个标题下的相关面板的集合。 要展开面板组，请喀呖声组名称左侧的展开箭头；要断开面板组的停靠，请拖动组标题栏左侧的驾驶盘。 7.1.2.9菜单概要对Dreamweaver 8的各菜单的功能进行简单说明。 “文件”菜单：“新建”、“打开”、“保存”和“全部保存”，以及用于查看当前文档和对当前文档执行动作的命令，如“在浏览器中预览”和“打印查询密码”。 “编辑”菜单：包含“选择父标签”和“查找和替换”等选择和查找命

6、令。在“编辑”(edit )菜单中，还可以网站数据库DW菜单的“首选项”(preferences )。 “视图”(view )菜单：用于显示文档的不同视图(如“设计”视图和“查询密码”视图)，以及显示或隐藏不同类型的页面元素、DW工具和工具条。 “插入”菜单：用于将对象作为“插入”栏的替代方法插入到文档中。 修改菜单：用于修改选定页面元素或项的属性。 使用此菜单可以编辑标记的属性腻子粉、更改表格和表格元素，以及对库项目和数字大板块盘执行不同的操作。 “文本”菜单：可以方便地设置文本格式。 “命令”(command )菜单：包含根据提供各种命令的网站数据库的格式首选项设置查询密码格式的命令、创建

7、音乐专辑的命令等。 “站点”菜单：提供用于管理站点和上载和下载文件的菜单项。 “窗口”菜单：可网站数据库到DW中的所有面板、检查器和窗口。 “帮助”菜单提供到Dreamweaver文档的网站数据库，包括使用Dreamweaver和创建Dreamweaver高级特征的帮助系统，以及各种语言的参考资料。 使用7.1.2.10面板和面板组Dreamweaver面板组织成面板组。 面板组中选定的面板显示为选项卡。 每个面板组都可以展开或折叠，并且可以与其他面板组停靠或取消停靠。 如果需要，可以显示或隐藏工作区中的面板组和面板。 创建7.2.1本地站点的网站是一组相关主题、相似设计、网络链接定文档、资源

8、等。 因为Dreamweaver 8是站点创建和计算机管理软件，所以它不仅可以创建单独的文档，还可以创建完整的网站。 创建网站的第一步是修订版。 为了取得最佳结果，在创建网站页面之前，必须设置和修订网站结构。 确定要创建的页数、每页要显示的内容、页面版结构的外观以及页面之间的连接方式。 创建网站时，首先在本地计算机上创建网站，然后传输到网际网络上的虚拟空间。 下面主要介绍创建本地站点和命名站点文档。 以创建“校园生活站点”为例，介绍具体的操作步骤。 (1)启动Dreamweaver8: (2)从“站点”菜单中选择“新站点”。 出现“站点定义”对话计程仪框。 如图7-8所示。7.2站点的创建和管

9、理、7.2站点的创建和管理、图7-8站点定义对话框计程仪框、(3)“站点定义”对话框计程仪框有两个选项卡。 如果对话框中有“高级”选项卡，请喀呖声“基本”。 显示站点定义向导的第一个界面，您必须首先输入站点的名称。 在字符框中键入名称，以在Dreamweaver 8中标识站点。 名称可以是任意名称。 例如，输入“校园生活网站”。 喀呖声“下一步”。 (4)出现向导的下一个界面，询问是否使用服务器技术。 如图7-9所示。7.2站点的创建和管理、图7-9站点定义对话框、斯坦共和国正在创建静态站点，因此选择“不，不想使用服务器技术”。 表示当前该站点是静态站点，没有动态页面。 喀呖声“下一步”。 (

10、5)显示向导的以下界面，询问如何使用文件。 选择标签条为“编辑我的电脑上的本地副本，完成后上载到服务器(推荐)”的选项。 有多种方法可以在站点开发期间处理文件，但是首次创建网页的用户必须选择此选项。 如图7-10所示。 7.2站点创建和管理，图7-10站点定义对话计程仪框，(6)在下面的“文件存储在计算机的哪里？ 中的说明，使用切割与对齐贴上工具。 出现“选择站点校园生活的本地根文件夹”对话计程仪框。 喀呖声“创建新文件夹”按钮，在d光盘上创建一个名为“myweb”的站点文件夹，并将其作为“校园生命站点”的本地根文件夹。今后网站的所有文档、资源请保管在这里。 喀呖声“打开”，然后在出现的对话框

11、计程仪框中喀呖声“选择”按钮。 到站点定义界面。 出现在字符框上的“D:myweb”是站点文件夹所在的位置。 喀呖声“下一步”。 (7)出现向导的下面的接口，询问法与远程服务器的连接方法。 从弹出式菜单中选择“无”。 因为有关远程站点的信息以后可以设置。 当前，本地站点信息一盏茶用于开始创建网页。 (8)喀呖声“下一步”按钮后，向导的下一个画面会显示上述所有设定的概要。 如图7-15所示。7.2站点的创建和管理、7.2站点的创建和管理、“站点定义”完成画面、7.2.2本地站点的管理：如果对创建的站点不满意，可以随时修改、编辑。 例如，重命名站点、更改站点的存储位置等。 具体的操作步骤如下： (

12、1)选择“站点”菜单“管理站点”。 出现“管理站点”对话计程仪框。 (2)可通过喀呖声“新建(n )”按钮创建新站点。 (3)从左侧的网站列表中选择网站后，喀呖声“编辑(e )”按钮：可以重新编辑选择的网站。 喀呖声“复制(p )”按钮：允许复制所选站点。 喀呖声删除按钮：用于删除选定站点。 (4)喀呖声“完成”，关闭“管理站点”对话框。7.2站点创建和管理、7.2.3本地站点资源管理：编辑站点时，可能需要管理多个站点。 在编辑一个网站时，您可能需要重复使用网站中的其他资源。 在7.2.3.1交换机站点Dreamweaver 8中编辑网页时，一次只能操作一个站点。 因此，可能需要在多个站点之间

13、切换。 要进行操作，请喀呖声“文件面板”左侧的下拉列表框中的展开按钮，在展开的下拉列表中喀呖声要切换的站点。7.2创建和管理站点，使用7.2.3.2资源面板，管理站点资源喀呖声文件面板的资源选项卡，打开资源面板。 “资源”面板的左侧将显示一个垂直列图标，指示此站点上所有可用资源的分类。 如果推一推表示类的按钮，右侧的列表中将显示该类所有资源的文件名及其基本属性。 创建网页时，可以使用“定径套”面板轻松地将选定的定径套添加到页面中。 例如，可以通过拖动将选定的定径套直接添加到页面中，也可以使用“定径套”面板底部的“插入”按钮将选定的定径套插入到页面中。 建立和管理7.2网站，建立7.3.1网站后

14、，必须开始编辑网页。 Dreamweaver提供了多种创建新页面文档的方法。 例如，打开Macromedia Dreamweaver 8后，进入图7-2所示的画面后，如果在中央的“创建新项目工程”中选择第一个项目“HTML”，则可以打开空文档。如果在文件菜单下喀呖声“新建”命令创建新的空白文档在“文件”面板中右键喀呖声，然后从出现的快捷菜单中选择“新建文件”，将在当前站点创建一个未命名的Html文档。7.3页的基本property腻子粉，在7.3.2页的基本property腻子粉工作区中喀呖声鼠标右键，然后在出现的快捷菜单中选择“页面property腻子粉”打开“页面property腻子粉”对

15、话框计程仪。 如下图所示。 在对话框的左侧有一个分类列表，将页面的部署腻子粉设置分为“外观”、“网络链接”、“标题”、“标题/编码”和“标题蕾丝花边图像”五个类别。7.3网页的基本属性、7.3.3网页文档的保存菜单喀呖声“文件”的“保存”命令，显示“另存为”对话框计程仪，选择保存位置，设定保存文件名(例如“index.html”)的多个、7.3页的基本属性，7.3.4在阅读页的运行效果文档工具条的“标题”栏的字符框中填写页的标题，如“校园生活网站主页”。 在执行浏览器时，这些个的内容会出现在网页的标题栏上。 在文档工具条中找到球体的预览图标，喀呖声下拉列表并选择要使用的浏览器(例如“IExpl

16、ore 6.0”)，将启动浏览器，查看创建的网页在浏览器中执行的效果。7.3网页的基本属性，可在7.4.1专业腻子粉检查器中向文档窗口输入文字，在专业腻子粉检查器中设定文字的各属性。 图：7.4页文本的格式、文本的设定属性、7.4.2利用CSS样式7.4.2.1 CSS样式的基本概念CSS是英语的“Cascading Style Sheet”的简称。 是一组称为样式表的格式规则。 栈内存是指可以将多种格式应用于云同步的网页中的同一对象。 制作美丽的网页一定要用CSS。 堆叠样式表(CSS )控制网页内容的外观。 CSS样式可以特罗尔许多仅通过HTML无法特罗尔的属性。 使用CSS风格更重要的是

17、，节省网站制作者的大量重复劳动，显着提高生产效率。7.4页文本的格式、7.4.2.2创建CSS样式要创建CSS样式，请(1)喀呖声“文本”菜单“CSS样式”“新建”，打开“新建CSS规则”，如图7-28所示。 (2)在“选择器类型”下，选择“类(可用于任何标签条)”。 (3)将制作的CSS样式命名为“CSS-1”。 (4)“定义位置”栏中有两个选项：新样式表文件：将创建的样式保存为一个. css文件。 此文件中定义的规则也可用于其他页面文档。 仅限于此文档：创建的样式仅适用于当前文档。 的双曲馀弦值。 7.4页文本的格式。 在此选择“新建样式表文件”。 喀呖声“确定”以打开“保存样式表文件”对

18、话框计程仪。 (5)将制作的样式表文件命名为“mycss-1”。 喀呖声“保存”(save )将名为“mycss-1.css”的新样式表文件添加到站点文件夹中。 (6)在打开的css规则定义对话计程仪框中，如图7-31所示，将各选项设定为所需的样式。 您可以在此设置行高，但HTML不能设置行高。 (7)在分类列表中，可以选择“背景”来设置页面背景的各个属性，也可以选择“边框”来向对象添加各种边框效果。 (8)喀呖声“ok”，完成CSS-1的设定。 (9)此时，在“CSS样式”面板中显示设定样式的各属性的列表。7.4页文本格式化、应用7.4.2.3css样式1 .应用于当前文档：1)选择要使用样式的对象(如某些文本)。 2 )在专业技