重庆邮电大学计算机科学与技术学院胡军.ppt

《重庆邮电大学计算机科学与技术学院胡军.ppt》由会员分享，可在线阅读，更多相关《重庆邮电大学计算机科学与技术学院胡军.ppt（34页珍藏版）》请在三一文库上搜索。

1、网页编辑工具简介,2.1制作时应该注意的原则,总体来说，要了解以下基本设计原则： （1）主页排版不要太松散或用太大的字，尽量避免访问者浏览网页时要用大幅度的滚动，对于篇幅太长的一页可以使用内部链接解决。须知，一页的上部是很显眼而且宝贵的地方，不要只放几个粗大的字或图片。 （2）切勿以800600以上的分辨率设计网页，常用的分辨率是640480及800600。现在国内的站点基本上都是800600，但是如果主要是面向国外访问者的站点，建议使用640480。,2.1制作时应该注意的原则,（3）底色或墙纸必须与文字对比强烈，以易于阅读。这并不是要求永远使用鲜亮的背景搭配深色的文字，但深色背景常要求与主

2、题配合，有较多的顾虑。如果网页是文章式或是包含大量文字，不妨在底色与文字的搭配上下些功夫，力求让访问者能够舒适地阅读网页。 （4）不要把图片白色当作透明，要知道别人的系统不一定把内置设为白色，解决的办法除了真的把该网页的底色设为白色之外，最好还是用图片编辑工具将图片设为透明颜色。,2.2用FrontPage制作网页,FrontPage 2002 是目前世界上最优秀的网页制作与开发工具之一，是Microsoft 公司推出的办公自动化大型套装软件Office的一个重要组件，它采用与Office其他组件一致的工作界面和操作方式，只要用户使用过Office软件，就可以方便地掌握FrontPage 20

3、02。 FrontPage 2002与其他Office软件的窗口大致相似，都有一些常用的菜单选项和工具栏，即使从来没使用过FrontPage 2002的用户也会对它有一种熟悉的感觉。,2.2.1如何建立一个站点,建立站点的具体步骤： （1）打开【文件】|【新建】|【网页】|【新建网页或站点】|【根据模板新建】|【Web站点模板】命令，打开“Web站点模板”对话框。 （2）在“Web站点模板”对话框中单击想要使用的Web站点模板。这里有很多可供选择的站点模板。为了简便其间，你可以选择一个现成的模板进行制作。,（3）在指定新站点的位置框中，键入新Web站点的URL或单击浏览器在硬盘、网络或Inte

4、rnet上创建新站点。如果你要创建子站点，可在根站点的名称之后追加子站点的名称，如果要将站点添加到当前Web站点，选中“添加到当前站点”即可。,2.2.2 FrontPage2002的工作界面,启动FrontPage后你会发现，FrontPage2002的工作界面同Word等Office应用程序的工作界面非常相似。不同的是在FrontPage2002的工作界面中多了一个“视图”栏，你可以选择不同的视图以完成不同的功能。好在Word也有视图的概念，你对此应该很容易理解。另外就是在编辑区左下方有3个小按钮，用于选择网页的显示方式。,2.2.2 FrontPage2002的工作界面,“普通”方式是你

5、编辑网页时最常用到的，它同Word的编辑区一样提供了基本的“所见即所得”的编辑界面。 “HTML”方式显示的是网页对应的HTML文件，它们看起来象程序员刚写好的程序代码一样，其实你把它看作一种程序也未尝不可，这就是网页的源代码。如果你擅长使用HTML语言，可以在这个视图中编写网页，你想学习HTML语言的话，也可以参考这里提供的文本。 “预览”方式可以不必打开浏览器即可看到自己编写的网页在浏览器里的实际情形。,.2.3 FrontPage2002的编辑方法,1、标题段落 在网页内输入标题时，用户可先设置标题的格式，然后再输入标题的内容，也可将标题当作普通文本对待，等输入完毕后，再打开格式工具栏中

6、的“样式”下拉列表框，选择合适的标题格式。FrontPage2002提供了6级标题。 2、 文本的修饰 在输入文本之后，其字体、字号、颜色和效果都使用默认设置。FrontPage提供了“字体”对话框与各种格式工具按钮，可根据需要选择设置，以美化文本。其设置方法同Word操作类似。,.2.3 FrontPage2002的编辑方法,3、水平线的插入 在网页中插入水平线有分隔文本内容的作用。插入水平线的方法如下： (1)将光标置于要插入水平线的行。 (2)选择“插入”菜单的“水平线”项，即在网页中插入了一条水平线。 (3)把鼠标放在水平线上，当光标变为双箭头时按住鼠标左键，可以对水平线进行长短或宽窄

7、的拉伸。 (4)还可以对水平线属性进行设置，在水平线上单击鼠标右键，在弹出的菜单中选择“水平线属性”，弹出属性对话框。 (5)大小栏中的宽度，高度可以设置水平线的宽与长。 (6)在对齐方式栏中可以设置水平线的对齐方式。 (7)还可以设置水平线的三维阴影，也可以将所有设置存为默认值，以便今后使用。,.2.3 FrontPage2002的编辑方法,4、列表的使用 使用列表和表格来规范网页内容可以使网页层次分明、结构清晰。列表有项目列表、编号列表、定义列表3种。,.2.3 FrontPage2002的编辑方法,项目列表 如网页的内容存在并列关系，内容中项目的顺序并不重要时，可以使用项目列表。项目列表

8、也称为无序列表，它将在项目前添加标志符号。默认的标志符号是实心圆点，FrontPage2002不仅提供了空心圆点、实心方框等其他类型的标志符号，还可以将图片作为新的项目标志。添加项目列表的步骤如下：,.2.3 FrontPage2002的编辑方法,(1)选定要使用项目列表的文本，或者将插入点放在要输入文本的位置上。 (2)单击格式工具栏按钮，此时项目符号出现在段落的段首。 (3)在输入项目列表的内容时，在输入完一段内容后回车，新的项目列表符号将出现在下一个段落的段首。,.2.3 FrontPage2002的编辑方法,编号列表 在网页中的内容存在顺序关系时，可应用编号列表，它表明列表内容的前后顺

9、序是有重要区别的或者前后顺序是不可以改变的。编号列表的标志符号可以是一连串数字，也可以是定义的英文字母、罗马数字等符号,创建编号列表的步骤和创建项目列表的步骤类似。 定义列表 定义列表就是在网页内定义词汇、术语的列表，具体的列表，具体的定义内容将以首行缩进的方式出现在列表的下一行。 列表嵌套 在复杂的网页中，需要将不同的列表方式嵌套时，则可以使用嵌套技术。,关于表格的操作 我们在FrontPage2002中创建表格有三种方法，分别是用菜单中的“表格”命令；用“常用工具栏”的“插入表格”按钮；用手绘制表格命令。,用菜单中的“表格”命令创建表格的步骤如下： (1)选择“表格”菜单中的插入子菜单的“

10、表格”命令 (2)在“大小”框体的“行数”栏中输入要设计表格的行数，在“列数”栏中输入要设计表格的列数。 (3)单击“确定”按钮。,用“常用工具栏”的“插入表格”按钮创建表格的步骤如下： (1)单击“常用工具栏”的“插入表格”按钮， (2)按住鼠标左键拖动鼠标确定要选取的表格行列数，如果4*5的表格则不能满足需要，可按住鼠标左键继续向大下方拖动。 (3)松开鼠标左键，所要插入的表格实现了。,用手绘制表格这种方式比较灵活，用这种方式可对已设置好的表格进行细节修改，其操作步骤如下： （1）选择菜单栏中的“表格”命令中的“手绘表格”命令。 （2）将鼠标移回网页编辑区，光标将变为铅笔状，按住鼠标左键拖

11、动即可画出表格的边框线。 （3）拖动出预期的虚线后松开鼠标左键即可绘制所需表格了。 在创建好表格之后，就有了表格的基本框架，然后就要往其中添加表格内容。表格的内容可以是文本、图片、音频文件、视频文件或超链接等。,关于表格属性的修改 表格还具有许多属性，如标题属性，对齐格式属性，边框属性，大小属性，背景属性和间隔属性，通过设置各种属性可以使表格更加美观。 标题属性：用于设置标题的位置，标题的位置可以在表格的顶部，也可以在表格的底部。 对齐格式属性：表格的对齐方式有两种：一种是水平对齐方式，另一种是垂直对齐方式。水平对齐方式有左对齐、右对齐、居中、两端对齐4种方式；垂直对齐方式有顶部对齐、低部对齐

12、、中部和基准对齐4种方式。 边框属性：边框属性包括两种，分为边框的大小和边框的颜色。边框的大小用于设置边框的宽度，当边框宽度为0时不可见。这样可以将网页分为几个区域，每个区域可以有各自不同的内容。,背景属性：表格的背景属性包括背景颜色和背景图像两个属性，可用于整个表格，也可以用于单个单元格中。设置背景颜色的步骤如下： （1）选定用户要编辑的表格。 （2）选择“表格”菜单中的“属性”子菜单中的“表格”命令 （3）在背景栏内选择“颜色”，即可设置整个表格的背景色。,间隔属性：表格的间隔由两个因素确定：一是单元格的填充，即单元格之间的间隔距离；一是单元格间距，即单元格内部的间隔距离。其设置方法如下：

13、 （1）选定要编辑的表格。 （2）选择“表格”菜单中的“属性”子菜单的“表格”命令，弹出“表格属性”对话框。 （3）在其中的“布局”框中输入单元格间距。 （4）单击“确定”按钮。,大小属性：表格的大小属性包括表格的宽度和高度。FrontPage2002设置表格大小属性有两种单位：一个是像素，另一个是百分比。FrontPage2002的默认宽度值是窗口的100%，和浏览器的窗口宽度相同；FrontPage 2002不指定默认高度值。以像素为单位进行设置：这种方式将表格的大小设定为固定值。当浏览器窗口小于表格时，表格的一部分将被遮住，只有通过滚动屏幕才能看到被遮住的部分；以百分比方式进行设置：以这

14、种方式设置的表格大小将随窗口的大小变化而变化。当表格大于其内部元素时，表格始终全部可见；当表格的大小等于其内部元素时，表格不再变小，可将表格内部元素设置为可变大小。,给网页添加图形的方法 添加图形是在网页中运行图形的第一步，大多数Web浏览器显示的图像格式有.GIF和.JPG两种。 一般来说插入图形的步骤如下： (1)打开“插入”菜单的“图片”子菜单，执行“来自文件”命令，或直接单击工具栏的“插入图片”按钮,在FrontPage2002中编辑图像的方法： 同样的，我们也可以对图片进行必要的编辑。在网页内插入图片后，单击图片将激活FrontPage2002的图片工具栏，即可对图像进行简单的编辑处

15、理，包括图像的特殊效果、剪切图像、添加文字等。,为了说明图像在网页内的作用与意义，可以在图像内添加一些说明性的文字。如果用图片作为网页的标题，那就更离不开必要的文字信息来简明扼要地反映网页的主旨。FrontPage2002图片工具栏的“文本按钮”就是用来在图像内添加文本信息的，并且所有的文本都在一个矩形区域内，步骤如下：,先选定图像后单击图片工具栏的“文本按钮”,将在图片上方出现文本框。然后用鼠标拖动文本框的边框可以改变文本框的位置，拖动文本框周围的黑色点标可以改变文本框的大小，然后可以在其中输入文本，完成后在图像外的网页内单击鼠标。还可以对文本框内的字体、字号、效果、对齐方式进行设置。如果以

16、后需要改变文本框中的文字，单击准备修改的文字，就会出现文本框，即可进行修改。 FrontPage2002提供了对图像进行旋转、翻转、修正对比度、调整亮度、黑白处理、图像弱化、突出效果、采样与还原等特效。,设置网页的背景色的方法 选择要设置背景色的网页，打开“格式”菜单，执行其中的“背景”命令，在随后出现的“网页属性”对话框中选择“前景”项，单击“背景”下拉列表框，选择一种颜色。如果想选择更为丰富的色彩，可在“背景”下拉列表中选择“更多颜色”，在屏幕窗口内采集颜色、定义新的色彩为网页的背景色。,设置图片为网页背景的方法： 可以使用当前技术从局域网、Web上获得的图片作为网页的背景。如果图片尺寸比

17、浏览窗口的尺寸小的话，它将重复铺满整个窗口。其设置步骤如下： 选择要设置背景色的网页，打开“格式”菜单，执行其中的“背景”命令，在随后出现的“网页属性”对话框内选择“背景”项。在“格式”栏中选择“背景图片”项，单击“浏览”按钮，选择图片的地址，单击“确定”按钮。 当图片尺寸较大时，可以选择“水印”。水印不随浏览器内的文本或其他内容一起移动，相反，当它们出现在浏览器的当前窗口时，水印图片将“浮”在网页上，只有文本在上下移动。,设置链接 链接是网页中的动态部分，当鼠标指向它时会使箭头指针变为手形指针。作为链接的字体颜色与网页上其他描述文字不同，很容易辨认。当按下鼠标启动链接时，它可以带用户到相应的

18、链接地址URL上。建立链接的方法和步骤如下： 将光标移动到要插入超链接的位置，单击工具栏中的“Link”按钮，弹出图所示的对话框。在URL文本框中输入要链接的网页的URL，如果此网页在本地计算机上，可以单击URL文本框右侧的第二个按钮来浏览寻找它的存放位置并进行选择，单击“确定”按钮，就建立了超链接。,以上是建立超链接的一种方法，也可以先输入文字，然后拖动鼠标选定要建立超链接的文字，单击鼠标右键，在弹出的对话框中，选择其中的“超链接”将会弹出对话框，然后按照上述的第二步也可以建立超链接。 目标(锚点)：当用鼠标选中一个链接后，网页能够移动到当前网页或网络上的另一个网页上的某一位置，则此位置即为

19、目标或锚点。使用目标可以在浏览网页时迅速翻动到想浏览的内容，节约了时间和精力。在当前网页内建立目标的步骤如下： 选定想定为目标的文字，在图中单击“目标框架”按钮，将弹出图所示的对话框。在其中输入指定目标的代号，将来在网页内建立链接时这个代号就是链接指向的地址，单击“确定”按钮。建立好目标后就实现了在网页内建立链接，这样就完成了在当前网页内建立目标，在网页中单击这个链接时它会跳到相应的目标位置。,使用表单 应用FrontPage2002创建表单很方便，其创建表单的方式有三种：表单模板、表单向导和自定义表单。,选定需要添加表单的网站，确定表单添加在第几页。选择“文件”菜单，打开其中的“新建”子菜单

20、，执行“网页”命令，将弹出“新建”对话框，在“常规”选项框中，有4个表单模块：意见反馈表单、来宾手册、搜索网页和用户注册。选择其中的一个模板，就可以创建相应的表单了。比如说，如果选择了用户注册模板，就在该网页中创建注册表单，通过浏览窗口可以观察注册表单的效果，,使用表单向导：使用表单模板只能创建最简单的几种表单，而用表单向导就可以随心所欲地创建表单了，使用表单向导的方法如下： 打开一个空白网页，它就是所创建表单的载体。在主窗口中选择“文件”菜单，打开其中的“新建”子菜单，执行“网页”命令，弹出“新建”对话框，在“新建”对话框的“常规”文本框中选择“表单网页向导”命令，打开“表单网页向导”对话框.,使用框架 FrontPage2002能够使用框架把浏览器窗口分成多个区域，每个区域可以说就是一个网页，这些区域之间一般有一定的联系，它们或者是并列关系或者是包含关系，使用框架能使网页之间的关系更明显，便于了解网页的结构。在设计时使用框架，也可以使自己的思路更清晰，使网页便于管理。,