将Fireworks表格插入Dreamweaver
到目前为止,你已经体验了跨产品的交互,从Dreamweaver到Fireworks再回到Dreamweaver。现在你将会进一步体验这种循环,将一个Fireworks表格放置到Dreamweaver中,并在Dreamweaver和Fireworks中编辑它,最后回到Dreamweaver中看到已经更新的文件。 你将从在Travel Detail页面中央空白区域放置一个Fireworks表格开始。 在Fireworks中输出带表格的图片 首先,你要打开PNG格式的源文件。 切换到Fireworks。 在Fireworks中,选择File->Open。 在弹出的对话框中,找到硬盘上存放xtutorial_dwfw4的目录,找到content.png文件,并打开它。#####2-##### content.png文件是一张大图片,但是已经被切割为很多个小矩形。如果想要了解更多关于创建切割的信息,请查看Fireworks帮助(FireworksHelp)中的使用热区和切割(UsingHotspots and Slices)。 点击工具条底部的显示切割(Show Slice)按钮显示出切割的边缘。 当你输出这张图片后,每个切割都会成为一个HTML表格的单元格。 选择File->Export。在Export对话框中做如下修改: 将文件保存的目录修改为xtutorial_dwfw4/images下的table目录。 将文件命名为content.htm 在Save As的弹出菜单中,选择HTML and Images。 在HTML弹出菜单中,选择Export HTML File。 在Slices弹出菜单中,选择Export Slices。 选择Include Areas Without Slices。#####3-#####1
到目前为止,你已经体验了跨产品的交互,从Dreamweaver到Fireworks再回到Dreamweaver。现在你将会进一步体验这种循环,将一个Fireworks表格放置到Dreamweaver中,并在Dreamweaver和Fireworks中编辑它,最后回到Dreamweaver中看到已经更新的文件。 你将从在Travel Detail页面中央空白区域放置一个Fireworks表格开始。 在Fireworks中输出带表格的图片 首先,你要打开PNG格式的源文件。 切换到Fireworks。 在Fireworks中,选择File->Open。 在弹出的对话框中,找到硬盘上存放xtutorial_dwfw4的目录,找到content.png文件,并打开它。
点击工具条底部的显示切割(Show Slice)按钮显示出切割的边缘。 当你输出这张图片后,每个切割都会成为一个HTML表格的单元格。 选择File->Export。在Export对话框中做如下修改: 将文件保存的目录修改为xtutorial_dwfw4/images下的table目录。 将文件命名为content.htm 在Save As的弹出菜单中,选择HTML and Images。 在HTML弹出菜单中,选择Export HTML File。 在Slices弹出菜单中,选择Export Slices。 选择Include Areas Without Slices。
点击Save完成输出并保存相关文件。 在Fireworks中,关闭content.png文件,但不要保存,同时不要关闭Fireworks。 将Fireworks表格插入Dreamweaver 现在,你已经将Fireworks表格输出到Dreamweaver网站中,接下来就可以把它放置到TravelDetail页面中了。 切换到Dreamweaver,并确认当前窗口中是Travel Detail页面。 点击表格中间空白单元格的左上角设置一个插入点。
在Dreamweaver中,点击Object面版上的插入Fireworks HTML按钮(InsertFireworksHTML)。
|