dreamweaver第1章基础知识课件.ppt

dreamweaverdreamweaver第第1 1章基础知识章基础知识InternetInternet简介简介1、Internet的概念 Internet的意思是计算机互连网。Internet是一个理想的信息交流媒体。Internet是一个庞大的信息资源库。Internet是一个花样众多的娱乐厅。Internet是一个既能省钱也能赚钱的场所。2、Internet的发展 Internet是人类历史发展中的一个伟大的里程碑，它是未来信息高速公路的雏形，人类正由此进入一个前所未有的信息化社会。人们用各种名称来称呼Internet，如国际互联网络、因特网、交互网络、网际网等等，它正在向全世界各大洲延伸和扩散，不断增添吸收新的网络成员，已经成为世界上覆盖面最广、规模最大、信息资源最丰富的计算机信息网络。3、HTML结构 网页中的源码告诉浏览器如何进行显示，HTML结构又是怎样的呢？一般HTML网页是以标签开始，以结束。之间是网页头部，用来描述网页的相关内容，如网页标题、网页语言和网页内容简述等。认识Dreamweaver Dreamweaver是一款可视化网页设计和网站管理软件。可视化编辑功能可以快速制作出精彩的网页，而不需要编写任何代码。而且，它能与其他图形编辑软件紧密结合，协同处理编辑图片，使用起来非常方便。同时，它还支持代码编辑环境，如颜色代码、自动补全和代码折叠等，更方便地进行代码编写，支持最新的CSS可视化布局。Dreamweaver特点1、简洁高效的设计和开发界面 是一个所见即所得的可视化网页编辑器。2 2、增强的HTML代码编辑功能 具有代码提示特性，片断面板，标记检视器。3 3、良好的扩展功能 可以通过Extension Manager，在Macromedia Exchange站点上下载所提供的免费的程序。4 4、提供完整的Web应用开发能力 可以对ASP、JSP、PHP、CFML、ASP.NET等Web技术进行支持，制作开发Web应用程序。5 5、更好的团队合作 可以与Microsoft Office产品的结合，并与Flash、Fireworks可无缝连接。Dreamweaver Dreamweaver 操作界面操作界面 新建或打开一个文档，进入Dreamweaver8的标准工作界面。Dreamweaver8的标准工作界面包括：标题显示、菜单栏、插入面板组、文档工具栏、标准工具栏、文档窗口、状态栏、属性面板和浮动面板组。1、标题显示栏 启动Macromedia Dreamweave 8后，标题栏将显示文字Macromedia Dreamweave 8.0，新建或打开一个文档后，在后面还会显示该文档所在的位置和文件名称。2、菜单栏 Dreamweave 8的菜单共有10个，即文件、编辑、视图、插入、修改、文本、命令、站点、窗口和帮助。其中，编辑菜单里提供了对Dreamweaver菜单中首选参数的访问。文件：用来管理文件。例如新建，打开，保存，另存为，导 入，输出打印等。编辑：用来编辑文本。例如剪切，复制，粘贴，查找，替换和参数设置等。查看：用来切换视图模式以及显示、隐藏标尺、网格线等辅助视图功能。插入：用来插入各种元素，例如图片、多媒体组件，表格、框架及超级链接等。修改：具有对页面元素修改的功能，例如在表格中插入表格，拆分、合并单元格，对其对象等。文本：用来对文本操作，例如设置文本格式等。命令：所有的附加命令项。站点：用来创建和管理站点。窗口：用来显示和隐藏控制面板以及切换文档窗口。帮助：联机帮助功能。例如按下F1键，就会打开电子帮助。3、插入面板组 插入面板集成了所有可以在网页应用的对象包括“插入”菜单中的选项。插入面板组其实就是图像化了的插入指令，通过一个个的按钮，可以很容易的加入图像、声音、多媒体动画、表格。图层、框架、表单、Flash和ActiveX等网页元素。4、文档工具栏 “文档”工具栏包含各种按钮，它们提供各种“文档”窗口视图（如“设计”视图和“代码”视图）的选项、各种查看选项和一些常用操作（如在浏览器中预览）。5、标准工具栏 “标准”工具栏包含来自“文件”和“编辑”菜单中的一般操作的按钮：“新建”、“打开”、“保存”、“保存全部”、“剪切”、“复制”、“粘贴”、“撤消”和“重做”。6、文档窗口 当我们打开或创建一个项目，进入文档窗口，我们可以在文档区域中进行输入文字、插入表格和编辑图片等操作。1)、设计视图 提供一个所见即所得的网页编辑窗口，在这里可以方便地插入图片、文字等页面元素。2)、代码视图 便于用户直接用HTML语言编写网页。3)、设计与代码视图 此模式下，窗口上半部分为网页的代码显示，下半部分为网页中的元素直接显示。这种方式可以方便用户查看、修改网页中插入元素的代码错误。7、状态栏 “文档”窗口底部的状态栏提供与你正创建的文档有关的其它信息。8、属性面板 属性面板并不是将所有的属性加载在面板上，而是根据我们选择的对象来动态显示对象的属性属性面板的状态完全是随当前在文档中选择的对象来确定的。例如，当前选择了一幅图像，那么属性面板上就出现该图像的相关属性；如果选择了表格，那么属性面板会相应的变化成表格的相关属性。9、浮动面板 其它面板可以同称为浮动面板，这些面板都浮动于编辑窗口之外。在初次使用dreamweave 8的时候，这些面板根据功能被分成了若干组。在窗口菜单中，选择不同的命令可以打开基本面板组、设计面板组、代码面板组、应用程序面板组、资源面板组和其它面板组。设计简单主页1、选择文件-新建，新建一个操作文档。2、选择文件-保存（index.html），在开始造之前，一定要先保存网页文档。3、选择修改-页面属性（Ctrl+J，背景颜色：6DCFF6天蓝色，左边距和上边距：0），设置网页文档等基本环境。4、在常用插入栏中单击“图像”，插入“title.gif”，然后多次按“Enter”键，光标定位于文档中间，单击“表格”（行列：1，宽度：100像素）。5、光标定位于表格中，单击“图像”，插入“main_img.gif”。6、单击“在浏览器中预览/调式”（F12）