项目了解网站的概念PPT课件

《项目了解网站的概念PPT课件》由会员分享，可在线阅读，更多相关《项目了解网站的概念PPT课件（31页珍藏版）》请在装配图网上搜索。

1、 .义务义务4 制造第一个网页制造第一个网页义务义务3 熟习熟习Dreamweaver CS3 义务义务2 与网站相关的几个概念与网站相关的几个概念义务义务1 经典网页赏析经典网页赏析工程工程1了解网站的概念了解网站的概念 门户网站腾讯网的主页。这样的网站是由众多子站点组合而成的，网站的信息量非常丰富，信息覆盖面非常广泛，信息分类合理，信息导航准确快捷，同时还有方便好用的搜索引擎。学院网站北京大学的主页。整个网页构造明晰，规划简单精练，页面左上方的学校Logo非常醒目，图文配合简约得体，颜色安静大方，表达出这所历史悠久的一流大学严肃的文化气味和宽松的学术气氛。商业网站阿里巴巴网站中文网站。阿里

2、巴巴网站设计风格简单有个性。首页中企业产品琳琅满目，合理分类和规划。点击产品链接后会有产品详细的图文阐明，运用非常方便，界面直观生动。前往 显示在一个窗口里的一切内容就构成一个完好的网页。这些网页其实就是存放在互联网中某处电脑里的一个个文件。网页文件常见的类型有.htm、.html、.asp、.jsp、.php、.aspx等。用于存放并有效地组织管理网页的文件夹就是网站，它存在于互联网中的网页效力器中。网页是网站中的一页，是构成网站的根本元素。网站中还会存放有图片、音频、视频等多媒体文件，这些文件经过网页的方式显示出来，构成了丰富多彩的视觉和听觉效果。互联网中的计算机假设安装了效力器软件就成为

3、效力器，可以为他人提供不同类型的信息效力。网页效力器Web效力器就是保管有网站文件夹，并能为他人提供网页信息效力的计算机。我们将制造完成的网站上传到Web效力器，他人就可以经过网络来访问这个网站了。阅读器是用来阅读网页的工具软件，其作用是对网页语法进展解析并将结果显示出来。常用的阅读器有：微软公司的IE、开源基金组织Mozilla的Firefox、苹果公司Safari、Google 公司的Chrome、Opera Software ASA公司的Opera等。网站上传到效力器之后，用户经过阅读器客户端的地址栏输入网站的网址，向效力器发送一个恳求，效力器根据不同的恳求将相应网页文件发送给用户客户端

4、，由客户端阅读器进展解析，并在阅读器窗口中显示解析的结果。此时电脑显现给用户的就是一页丰富多彩的网页了。静态网页是相对于动态网页而言，它没有后台数据库及数据处置程序、不可交互。静态网页更新起来比较费事，适用于显示固定内容或内容更新较少的展现型网站。动态网页是与静态网页相对应的，文件扩展名有.asp、.aspx、.php.jsp等。动态网页除了包含静态网页的一切内容外，同时还包含效力器端脚本(只能被效力器执行的脚本)。它经过与后台数据库相连，在功能上实现了与用户之间的数据交互，如用户注册、登录、在线调查、论坛、聊天室、订单管理等等。动态网页的信息在不同的情况下访问，会呈现不同的内容。静态网页与动

5、态网页的主要区别在于效力器对它们的处置方式不同：当效力器接纳到静态网页的恳求时，会直接将该页发送给客户端阅读器，不进展任何处置；假设接纳到动态网页的恳求，那么先从效力器中找到该文件，将它传送给一个称为运用程序效力器的特殊软件扩展，由它担任解释和执行网页，最后将执行后的结果作为网页文件传送给客户端阅读器。Fireworks CS3是一款图像处置软件，可以绘制矢量图，也可以处置位图。用它设计出是一款图像处置软件，可以绘制矢量图，也可以处置位图。用它设计出适宜的图像来配合网页，可以更好地表达网页所要表达的意思。可以输出适宜的图像来配合网页，可以更好地表达网页所要表达的意思。可以输出.png、.jpg

6、、.gif类型的文件。类型的文件。Flash CS3是一款交互式二维动画设计软件，可以将文本、图像、音频、视频等巧妙地是一款交互式二维动画设计软件，可以将文本、图像、音频、视频等巧妙地交融在一同，制造出高质量的动画效果。它输出的交融在一同，制造出高质量的动画效果。它输出的.swf文件就是网页中广泛运用的动画。文件就是网页中广泛运用的动画。Dreamweaver CS3是一款专业的可视化网页设计软件，利用它可以轻而易举地制造是一款专业的可视化网页设计软件，利用它可以轻而易举地制造出跨平台、跨阅读器的动态网页。本教材就是以出跨平台、跨阅读器的动态网页。本教材就是以Dreamweaver CS3软件

7、为根底引见软件为根底引见如何进展网页制造的。如何进展网页制造的。前往1在计算机中正确安装在计算机中正确安装Dreamweaver CS3后，可经过后，可经过开场开场按钮按钮“一切程序一切程序“Adobe Dreamweaver CS3来启动。来启动。也可在桌面建立也可在桌面建立Dreamweaver CS3的快捷的快捷方式图标，以后每次运转时双击该图标即可。方式图标，以后每次运转时双击该图标即可。2启动后，屏幕会弹出启动后，屏幕会弹出Dreamweaver CS3欢迎界面。欢迎界面。3选择选择“新建栏中的新建栏中的“HTML即可进入即可进入Dreamweaver CS3的任务界面。的任务界面。

8、标题栏菜单栏插入栏浮动面板组文档工具栏文档编辑区标签选择器形状栏属性面板 Dreamweaver CS3的任务界面主要由以下几部分组成：标题栏、菜单栏、插入栏、文档工具栏、文档编辑区、标签选择器、形状栏、属性面板和浮动面板组。1标题栏和菜单栏标题栏和菜单栏 标题栏位于窗口的最上端，标题栏位于窗口的最上端，显示显示Dreamweaver的版本和的版本和翻开的文件称号。翻开的文件称号。菜单栏位于标题栏的下方，菜单栏位于标题栏的下方，Dreamweaver CS3任务界任务界面中几乎一切的操作都能在菜单面中几乎一切的操作都能在菜单栏的菜单项选择项中找到对应的栏的菜单项选择项中找到对应的命令。命令。2

9、插入栏插入栏 插入栏中的选项，可以在编辑区中插人插入栏中的选项，可以在编辑区中插人相应的各类元素，如超链接、图像、动画、相应的各类元素，如超链接、图像、动画、表单、表表格、表单、表表格、APDiv等。等。3文档编辑区文档编辑区 文档编辑区是制造网页的区文档编辑区是制造网页的区域，网页元素可以经过各种方域，网页元素可以经过各种方式插入到编辑区中。在编辑区式插入到编辑区中。在编辑区的左上角，显示网页文件的称的左上角，显示网页文件的称号，默许的是号，默许的是untitled-1，假，假设称号后有设称号后有“*，阐明该网页，阐明该网页文件发生了修正却没有保管，文件发生了修正却没有保管，保管后保管后“*

10、会消逝。会消逝。在代码视图中可以经过书写在代码视图中可以经过书写HTML代码的方式制造网页；代码的方式制造网页；在拆分视图中能同时运用代码视图和可视化视图。在拆分视图中能同时运用代码视图和可视化视图。在设计视图中实现可视化的设计方式，设计视图是默许方式。在设计视图中实现可视化的设计方式，设计视图是默许方式。“标题文本框，用于输入网页标题栏的信息。标题文本框，用于输入网页标题栏的信息。按钮用来设置阅读器信息，单击后弹出按钮用来设置阅读器信息，单击后弹出相应菜单，在菜单中可以选择网页用相应菜单，在菜单中可以选择网页用何种阅读器阅读。何种阅读器阅读。视图选项按钮视图选项按钮 可以控制视图形状，可以控

11、制视图形状，标尺、网格和辅助线都可以在弹出的标尺、网格和辅助线都可以在弹出的菜单中选择。菜单中选择。4形状栏形状栏 文档编辑区的下端是形状文档编辑区的下端是形状栏。形状栏左侧为标签选择栏。形状栏左侧为标签选择器，经过选择标签选择器能器，经过选择标签选择器能方便地选中文档编辑区的内方便地选中文档编辑区的内容。容。例：编辑区有一个表格，标签选择器如图例：编辑区有一个表格，标签选择器如图要想选中某个单元格，单击标签选择器中的要想选中某个单元格，单击标签选择器中的标签即可。标签即可。形状栏右侧的按钮形状栏右侧的按钮 依次为依次为选取工具、手型工具、缩放工具、设置缩放比例、窗口大小选取工具、手型工具、缩

12、放工具、设置缩放比例、窗口大小及网页的下载速率及网页的下载速率 5面板面板 文档编辑区的下方是属性文档编辑区的下方是属性面板，中选中编辑区中的某面板，中选中编辑区中的某个网页元素时，经过属性面个网页元素时，经过属性面板可以定义该元素的属性。板可以定义该元素的属性。属性面板和文档窗口之间的按钮属性面板和文档窗口之间的按钮 用于显示或隐藏属性面板。用于显示或隐藏属性面板。单击属性面板左上角的按钮单击属性面板左上角的按钮 收起属性面板，收起属性面板，此时该按钮为此时该按钮为 ，单击它那么会展开属性面板。，单击它那么会展开属性面板。窗口右侧还有多个面板，称为浮动面板组。窗口右侧还有多个面板，称为浮动面

13、板组。经过经过“窗口菜单栏可以选择显示或隐藏那些窗口菜单栏可以选择显示或隐藏那些面板。当鼠标放到面板标题左侧时，会变成面板。当鼠标放到面板标题左侧时，会变成 外形，按住鼠标左键拖拽它，能调整外形，按住鼠标左键拖拽它，能调整浮动面板的位置。浮动面板的位置。选择“Dreamweaver协助，或在编辑形状下按“F1键，均可翻开Dreamweaver协助窗口。前往1启动启动Dreamweaver CS3，在欢迎，在欢迎界面中选择界面中选择“新建栏中的新建栏中的“HTML，窗口，窗口中就出现一个新的空白网页。中就出现一个新的空白网页。2输入网页内容如图。输入网页内容如图。文中每段开头应输入4个半角空格占

14、2个汉字位。由于默许情况下Dreamweaver不允许延续输入多个空格，我们可以用以下两种方式之一进展延续多个空格的输入：Ctrl+Shift+空格键。“编辑菜单“首选参数，翻开“首选参数对话框，在“常规项中选中“允许多个延续空格。1Ctrl+A选中全部文字。选中全部文字。2单击单击“属性面板中的属性面板中的“字体工具，字体工具，选择选择“宋体。宋体。假设列表中没有“宋体字体，可在列表中选择“编辑字体列表，翻开“编辑字体列表对话框，如右图，在“可用字体中选择“宋体，再单击“按钮，“确定，即可添加字体到“属性面板中。1选中标题文本，在选中标题文本，在“属性面板中设置属性面板中设置文本字体大小为文

15、本字体大小为36。2单击面板中的加粗按钮单击面板中的加粗按钮 给标题给标题文本加粗。文本加粗。1单击单击“插入工具栏中的插入工具栏中的“图像按钮图像按钮 ，选择，选择“，翻开翻开“选择图像源文件对话框，如图，定位到素材文件夹选择图像源文件对话框，如图，定位到素材文件夹images中的中的01.jpg文件，单击文件，单击“确定按钮。确定按钮。2选中图片，单击选中图片，单击“属性面板中的属性面板中的“居中按钮居中按钮 。在文档工具栏在文档工具栏“标题框中输入网页标题标题框中输入网页标题“我的第一个网页。我的第一个网页。保管网页文件的方法有多种：Ctrl+S。单击“文件菜单“保管。封锁网页文件时，软件提示能否保管。此时会翻开的“另存为对话框，输入文件名如index.htm，定位好文件位置后，再单击“保管即可。单击文档工具栏中的“在阅读器中预览/调试按钮，选择“预览在IExplore，或在编辑形状直接按F12键，即可进展预览。阅读网页前应保管网页，假设没有保管，Dreamweaver会弹出保管提示框，如下图。单击“是按钮。网页的预览效果 前往