用Dreamweaver制作网页解读.ppt

一、网页构思、素材准备 首页的设计 页面属性的设置 　　从菜单栏选择“修改” →“页面属性”，或从属性面板中单击页面属性按钮，弹出页面属性设置对话框，进行背景、标题、页面边距等设置。 返回目录 * * Dreamweaver网页制作 基础 教 程 2016年4月23日 用Dreamweaver 制作网页 网页构思、素材准备 2. 网页制作软件简介 3. 建立网页文件夹 4. 新建站点 5. 用表格布局网页 6. 文字的输入 7. 在网页中使用图像 8. 图文混排 9. Flash动画的插入 声音背景音乐 视频的插入 12. 网页间的链接 13. Css样式 14. 模板的制作 15.层的使用 　　能否将网页做好，最重要的是要有一个十分清晰的思路，从而产生一个对整个网页的合理布局。　 　　首先确定网页主题，根据网页的主题需要规划好一级、二级菜单的内容。 　　收集好网页制作所需要的素材（文字、图片、动画、声音、视频等）。 　　　　　用网页做课件也是同样的步骤。 　 有的素材需要自己制作，有的可以在网上（利用百度）搜集自己需要的文字、图片、动画、声音、视频等素材。 　　　获取网上Flash文件：工具—— internet选项——浏览历史记录中的设置——查看文件。 返回目录 初识Dreamweave 网页制作工具有Dreamweaver 、 FrontPage 、Photoshop、Fireworks、Flash 等 。 Dreamweaver 、Fireworks、Flash 三个软件合在一起，被称为网页制作“三剑客”，这三个软件相辅相承，可谓是制作网页的最佳拍档。 Macromedia Dreamweaver是一款专业的网页制作软件，用于对 Web 站点、Web页和Web应用程序进行设计、编码和开发。无论开发者愿意享受手工编写HTML代码时的驾驭感，还是偏爱在可视化编辑环境中工作，Dreamweaver都会提供实用的工具，使网页设计者拥有更加完美的Web创作体验。 Dreamweaver工作环境 （Dreamweaver 提供了将全部元素置于一个窗口中的集成工作区。在集成工作区中，全部窗口和面板集成在一个应用程序窗口中。 ） 工作窗口布局 Dreamweaver 的三种视图模式（代码、拆分、设计） 二、网页制作软件简介 返回目录 　　做网页之前应先建好文件夹及子文件夹，以便分类存放网页中使用的图片、动画等素材。文件夹名一般是网页主题的名字。 练习1：建立自己的网页文件夹。 注意： 　　Dreamweaver对中文文件名支持得不是太好，经常会有页面调用不正确的现象发生，在新建文件夹或在Dreamweaver中保存网页的时候，用英文或者数字作为文件名称，就可以避免上面的出错现象。 返回目录 三、建立网页文件夹 新建站点步骤： 　　打开Dreamweaver软件，在工具栏中，点击站点-新建站点，这时会弹出一个面板，在这个面板上有基本和高级两种选择。在这里，我们选择基本，给你的站点起个名字(要是英文的)，下面的文本框，要填写http地址，这个不用去管它。 　　单击下一步，会提示你“是否使用服务器技术”，选择“否，我不使用服务器技术” 。 　　单击下一步，选择“文件存放的位置”，这里文件位置，是你存放站点的路径。 　　单击下一步，选择“是否连接远程服务器”，在这里，我们选择“本地/网络”。选择“文件存储在服务器上的文件夹”，选择和上一步存放的文件在同一目录下。 　　单击下一步，会提示你是“否存回和取出文件”，这个不用管它，单击下一步，点击完成。 返回目录 Dreamweaver 不仅仅是网页设计工具，更是网站设计工具，提供了大量和网站管理维护相关的功能，能够对网站中的文件、链接、媒体文件等多种资源进行统一管理，使网站设计工作事半功倍。要想使用Dreamweaver 的网站管理功能，必须首先建立“站点”。 四、新建站点 练习2：建立自己的网页站点。 下面使用Dreamweave制作一个简单的网页，介绍一下Dreamweave制作网页的基本流程。 1．新建网页 2．编辑网页 3．保存网页 4．预览网页 5．继续编辑网页 6．再次预览网 用Dreamweaver制作简单网页 页面属性的设置主要控制页面的整体外观，包括背景、标题等。Dreamweaver 提供了【页面属性】对话框，在这个对话框中提供了多种页面属性的设置方法。 1．设置背景图片 2．设置页面标题 3．设置页面边距 新建网页、设置页面属性 　　课件的首页是访问者看到的第一页，是课件关键性的一页，人们往往看到第一页就已经