网页设计-武汉大学ppt课件

.,1,第四章制作简单网页,彭煜玮武汉大学计算机学院2009.9,.,2,内容提要,文本及排版设置文件头和网页属性插入表格插入多媒体对象插入JavaApplet创建超级链接,.,3,文本及排版,插入文本格式化文本创建项目列表,.,4,插入文本,在页面中插入文本的方法大致有三种。第一种是直接输入法，在打开Dreamweaver文档窗口时，将光标定位到需要输入文本的地方，直接键盘输入即可。第二种方法是复制粘贴，选取合适的文本，直接复制到Dreamweaver文档窗口中的光标所在处。最后一种方法是导入已有Word文档，在Dreamweaver文档窗口中，将光标定位到要导入文本的地方，选择菜单“文件”|“导入|”|“WORD文档”命令，弹出“导入Word文档”对话框，在其中选择要导入的Word文档，单击该对话框的“打开”命令，就可以导入文本了。,.,5,格式化文本,设置字符格式选择要设置的文字；单击“字体”下拉列表，选择字体（或用“编辑字体列表”添加新的字体）；用“大小”下拉列表设置文本的大小；在“颜色”框中输入颜色代码，也可以用选色棒在拾色器上取色；用B、I、U等按钮设置粗体、斜体、下划线等。示例4-1-2.html,演示,.,6,格式化文本,使用段落和标题使用“属性”面板中的“格式”下拉列表框，可以设置文本的样式。“段落”样式应用标签；“标题X”样式应用标签，X越大标题越小。示例4-1-2.html,演示,.,7,格式化文本,对齐文本使用“属性”面板中的对齐按钮实现文本对齐。左对齐居中右对齐两端对齐缩进与扩展首行缩进,演示,.,8,创建项目列表,无序项目列表无序项目列表通常用各种几何符号来表示其列表关系，其主要用于一种并列关系的元素组合，各列表项之间并不存在先后主次的顺序。有序项目列表有序项目列表也称为编号列表，代表一种进程，各列表项之间存在着先后过程，通常用阿拉伯数字或字母有序符号表示。嵌套项目列表如果想把不同级别的文本内容用列表的形式表现出来，则需要用到项目列表的嵌套。创建项目列表的嵌套，需要用到文本属性面板上的段落扩展/缩进按钮。,演示,.,9,设置文件头和网页属性,文件头在浏览器中是不可见的，但却含有网页的重要信息。它还可以实现一些非常重要的功能，以下将重点介绍与文件头相关的内容。设置网页的编码设定文档标题添加关键字设置网页的刷新插入meta对象,.,10,设置网页的编码,.,11,设定文档标题,.,12,添加关键字,可以为当前文档定义关键字，关键字用来协助网络上的搜索引擎寻找网页。很多的浏览者先通过搜索引擎找到该网页的。插入-常用-文件头-关键字,.,13,设置网页的刷新,网页刷新通常用于两种情况：第一种情况是在打开某个网页后的一定时间内，让浏览器自动跳转到一个新网页：第二种情况是用于需要经常刷新的网页，可以让浏览器每隔一段时间自动刷新自身网页。插入-常用-文件头-刷新,.,14,插入meta对象,meta标签是记录有关当前页面的信息（如字符编码、作者、版权信息或关键字）的文件头元素。这些标签也可以用来向服务器提供信息，如页面的失效日期、刷新间隔和PICS等级。（PICS是Internet内容选择平台，它提供了向Web页分配等级（如电影等级）的方法。）“属性”指定meta标签是否包含有关页面的描述性信息（name）或HTTP标题信息（http-equiv）。“值”指定在该标签中提供的信息类型。“内容”是实际的信息。,.,15,插入表格,制作表格编辑表格表格属性面板的使用,.,16,制作表格,制作简单表格制作嵌套表格,演示,.,17,编辑表格,编辑表格的基本操作选择表格选择行列选定单元格合并与拆分单元格插入行列删除行列格式化表格,演示,.,18,编辑表格的高级操作,隐藏单元格之间的分隔线,演示,.,19,表格属性面板的使用,通过对表格及单元格的属性面板的设置可以对表格进行更多灵活变化。,演示,.,20,插入多媒体对象,使用图像插入flash对像插入视频对象插入音频对象,.,21,使用图像,插入图像鼠标经过图像设置图像属性示例image.htm,演示,.,22,插入flash对像,插入flash动画插入flash按钮使用Flash文本对象插入Flashpaper插入Flash元素示例myhome.html,演示,.,23,插入视频对象,插入FlashVideo插入Shockwave影片插入ActiveX示例Guizhoumovie.htm示例flashvideo.htm,演示,.,24,插入音频对象与插入JavaApplet,插入插件插入JavaApplet示例JavaApplet.htm,演示,.,25,java程序分为两类:Java小程序(Applet)和Java应用程序(Application),这两类程序是有区别的。JavaApplet嵌入在WWW的页面,作为页面的组成部分被下载,并能运行在实现Java虚机器(JVM)的Web浏览器中。Java的安全机制可以防止小程序存取本地文件或其他安全方面的问题。而一个Java应用程序运行于Web浏览器之外,没有Applet运行时的诸多限制。另外,两者程序设计上的最大区别在于:JavaApplet没有主程序,而Java应用程序一定要有主程序。,.,26,创建超级链接,地址和链接文件地址超级链接添加链接书签链接和热点链接,.,27,文件地址,绝对地址在网页中如要创建一个外部链接，就需要使用一个绝对地址。绝对URL是指某个文件在网络上的完整路径。例如：,.,28,创建链接（续）,（2）绝对地址与相对地址（续）相对地址文件相对地址文件相对地址描述了某个文件（文件夹）相对另一个文件（文件夹）的相对位置。即使站点根目录发生变化，这种形式的地址也不会受到影响。当站点管理器内进行文件的重命名、文件的移动、文件夹的移动等操作时，用文件相对地址创建的链接都会动态地进行更新。某站点的目录结构:/index.htm;/exercise/images.htm;/data/index.htm下面以这个站点中的文件为例说明文件相对地址的写法。,.,29,创建链接（续）,（2）绝对地址与相对地址（续）相对地址文件相对地址（续）如果要创建从exercise目录下的images.htm到站点根目录下的index.htm的链接，链接地址应是“./index.htm”。如果exercise目录下的images.htm到data目录下的index.htm的链接，链接的地址应是“./data/index.htm”。,.,30,创建链接（续）,（2）绝对地址与相对地址（续）相对地址根目录相对地址如果要创建的是内部链接，用户还可以选择根目录相对地址，这种地址在动态网页编写时用得比较多，但如果只是静态的网页，使用文件相对地址还是方便得多。根目录相对地址的书写形式比较简单，首先以一个向右的斜杠开头，用它代表根目录。然后再书写文件夹名，最后书写文件名。例如，要创建到exercise目录下的images.htm的链接，任何文件中的链接地址都可以写成“/exercise/images.htm”。根目录相对地址和链接目标文件的位置是没有关系的。,.,31,超级链接,一个网页一定少不了超级链接，可创建到文档、图像、多媒体文件或可下载软件的链接。可建立到文档内任意位置的任何文本或图像的链接。当浏览者单击设置好超级链接的网页元素时，将会从当前页面转到关联页面中。