Dreamweaver入门课件.ppt

Dreamweaver 入门 先认识一下网站与网页 网站：website 网页：webpage 网站是由多个网页组成的整体。 网站＝网页1＋网页2＋网页3＋…… 制作网站时，要先把一个一个网页制作出来，然后通过超级链接组成一个网站。（以我的个人主页为例） 网页的格式可以为：html，htm，asp，php等。 其中，网站的首页面通常命名为：index.htm 或者index.html或者default.htm 或者default.html 常见的网页制作工具有哪些 Dreamweaver Frontpage 今天我们主要学习Dreamweaver 学习目标 能够制作简单的网站（例：学生作品） 内容提纲 先跟我做，别问为什么 认识dreamweaver的界面 建立站点 页面编辑 超级链接 表格设计 网页布局 层 网页代码 网页特效 网页中各种元素的编辑软件 网页素材下载 利用网络学习dreamweaver 跟我做，先别问为什么 打开Dreamweaver 插入文字和图片 保存 预览 这样，我们就制作了一个简单的页面文件。由此可见，dreamweaver和别的软件的用法有很多相似之处的。 认识Dreamweaver的界面 建立站点 Web 站点是一组具有相关主题的文档和资源。建立站点之前，应该对网站的内容结构做一些规划。 比如：以“我的个人主页”为主题的一个站点，其内容结构可能是： 建立站点（二） 当对网站的内容结构有了规划后，我们就要在dreamweaver里创建站点，来保存你将要制作的网站里的所有内容（包含图片、声音、网页文档等等）。 建立站点的过程： 先在计算机上建立一个文件夹，该文件夹务必用字母命名，这个文件夹里将存放你的站点里的所有内容。然后，在这个文件夹里分别建立images sound animation三个文件夹（根据需要，可以建立更多的文件夹） 在菜单中选择“站点（site）”“管理站点（manage sites）”， 出现“管理站点”对话框。 在“管理站点（ manage sites）”对话框中，单击“新建（new）”，然后从弹出式菜单中选择“站点（site）”。 然后，按照提示一步一步建立站点。 　 页面编辑 在开始制作之前，我们先对这个页面进行一下分析。看看这个页面用到了那些东西：（01.htm）1.网页顶端的标题“我的主页”是一段文字。2.网页中间是一幅图片。3.最下端的欢迎词是一段文字。4.网页背景是一深紫红颜色。 5. 页面的主题是“我的主页”注意：网页背景图片和颜色的设置 超级链接 为了建立起网页之间的联系我们必须使用超级链接。称“超级链接”，是因为它什么都能链接，如：网页、下载文件、网站地址、邮件地址……等等。 在dreamweaver中，有三种链接： 1、文字图片链接 2、热区链接 3、电子邮件链接 超级链接——文字图片链接 在网页中，单击了某些图片、有下划线或有明示链接的文字就会跳转到相应的网页中去。 　　1、在网页中选中要做超级链接的文字或者图片。　　2、在属性面板中单击黄色文件夹图标，在弹出的对话框里选中相应的网页文件就完成了。做好超级链接属性面板出现链接文件显示。（如下图）（注意：对于图片替代的操作）  超级链接——热区链接 要使一张图片上不同位置有不同的链接，这个时候，就要使用热区链接。 热区链接的步骤： 1、首先插入图片。单击图片，用展开的属性面板上的绘图工具在画面上绘制热区。 超级链接——电子邮件链接 在网页制作中，还经常看到这样的一些超级链接。单击了以后，会弹出邮件发送程序，联系人的地址也已经填写好了。这也是一种超级链接。制作方法是：在编辑状态下，先选定要链接的图片或文字（比如：欢迎您来信赐教！），在插入栏点 或点插入菜单选“电子邮件链接”弹出如下对话框，填入E-Mail地址即可。 表格设计 上面我们学习了简单的网页制作，但是这里有个问题：在页面中，怎样让图片、文字、动画出现在你想要其出现的位置？这就是一个页面排版的问题。 而表格就是为了实现页面的精确排版和定位的。 网页布局 通过上面的操作，我们发现，表格虽然是一个排版定位的工具，但是，表格不能定位一个随意的位置，用起来不很灵活。 在dreamweavre中，可以使用“布局”随意的在页面文档中绘制表格。 制作分析 在布局视图中，公司主页可利用表格来布局。制作时先新建一个HTML文档，在布局视图中，利用布局单元格在布局视图中将文档划分为公司名称栏、导航栏、标题栏和公司站点地图等几部分，最后设置布局页的背景效果。 用表格给公司主页布局 其具体操作如下： （1）选择[文件]?[新建]菜单命令，打开“新建文档”对话框，如图所示。