FRONTPAGE课件.docx

上传人:b****5 文档编号:6830957 上传时间:2023-01-10 格式:DOCX 页数:25 大小:132.20KB
下载 相关 举报
FRONTPAGE课件.docx_第1页
第1页 / 共25页
FRONTPAGE课件.docx_第2页
第2页 / 共25页
FRONTPAGE课件.docx_第3页
第3页 / 共25页
FRONTPAGE课件.docx_第4页
第4页 / 共25页
FRONTPAGE课件.docx_第5页
第5页 / 共25页
点击查看更多>>
下载资源
资源描述

FRONTPAGE课件.docx

《FRONTPAGE课件.docx》由会员分享,可在线阅读,更多相关《FRONTPAGE课件.docx(25页珍藏版)》请在冰豆网上搜索。

FRONTPAGE课件.docx

FRONTPAGE课件

一、新授:

1、创建无序清单(UL)

  无序清单用(UL)开始,无序列表的标题,每一个清单条目用

  • 引导,最后是,注意清单条目不需要结尾链接签
  • 输出时每一清单条目缩进,并且以黑点标示。

      ……
    无序列表的开始和结束

    ……无序列表的标题

  • 无序列表的条目

    例:

    源文件

      

      我的书架

        

    • Today

        

    • Tommorow

        

      站点上显示为:

    我的书架

    ●三国演义

    ●水浒传

    ●东周列国志

    ●乱世佳人

    ●追亿似水年华

    可通过来改变每一条目前的标记

    TYPE可以取以下几个值:

    NONE无标记

    DISC圆点

    CIRCLE圆圈

    SQUARE方块

    练习:

    试着把刚才的无序列表的标记改成方块

    2、创建有序清单(OL)

      无序清单用(OL)开始,有序列表的标题,每一个清单条目用

  • 引导,最后是,注意清单条目不需要结尾链接签
  • 输出时每一清单条目缩进,并且以黑点标示。

      ……
    有序列表的开始和结束

    ……有序列表的标题

  • 有序列表的条目

    例:

    源文件

      

      本店商品种类

        

    1. 服装

        

    2. 家电

    3. 化装品

        

    4. 清洁用品

      站点上显示为:

    本店商品种类

    1.服装

    2.家电

    3.化装品

    4.清洁用品

    (1)通过来改变每一条目前的标记

    TYPE可以取以下几个值:

    A大写字母

       a小写字母

       I大写罗马数字

       I小写罗马数字

       l缺省,阿拉伯数字

    练习:

    试着把刚才的有序列表的标记改成大写罗马数字

    (2)改变有序清单条目的超始数字

      有序清单的条目数字在缺省情况下是从1开始的,用start属性可修改这一值。

    方法为#是条目起始号

    练习:

    试着把刚才的有序列表的标记改成从第3个罗马数字开始

    二、作业:

    要求在站点上显示下面内容,请写出出源代码

    答案:

    下面代码放置在与间

      小组赛名次

      1. A组

      2. 日本

      3. 中国台北

      4. 印度

      5. 马来西亚

    • B组

    • 中国

    • 朝鲜

    • 越南

    • 缅甸

    小组赛名次

    A组

    1.日本

    2.中国台北

    3.印度

    4.马来西亚

    B组

    B.中国

    C.朝鲜

    D.越南

    E.缅甸

    一、新授:

    1、背影颜色和文本颜色的设置

    (1)窗口背景可以用下列方法指定

      

    后者指定的是16进制的红、绿、兰分量。

      bgcolor背景颜色

      例大红背景色。

    这里列出16种颜色的英文单词:

    BlackWhiteRedGreenBlueYellowMagentaCyan

    PurpleGrayLimeMaroonNavyOliveSliverTeal

    (2)文本颜色可以用下列方法指定

    文本

    2、背景图象

    例如:

    要把“D:

    \素材\back1.jpg”作为站点的背景图

    ///D:

    /素材/back1.jpg">

    3、插入图象的基本格式为:

      

      image-url是图象文件的url。

    目前,大部分浏览器支持.gif和.xbm文件,还支持jpeg文件。

    alt属性告诉不支持图象的浏览器用text代替该图。

    例:

    如果要在站点上插入一个图片“D:

    \素材\angel1.jpg”

    源代码是:

    ///D:

    /素材/angel1.jpg">

    4、指向一个目标

      在html文件中用链接指针指向一个目标。

    其基本格式为:

      字符串

      href属性中的统一资源定位器(url)是被指向的目标,随后的“字符串”在html文件中充当指针的角色,它一般显示为蓝色。

    当读者用鼠标点这个字符串时,浏览器就会将url处的资源显示在屏幕上。

    例如:

      搜狐

      用户用鼠标点取“搜狐”,即可看到搜狐的主页。

    在这个例子中,充当指针的是搜狐,下面我们将看到用图象做为指针的例子。

    若要把主页上的“个人简历”链接到“D:

    /我的主页/个人简历.html”

    ///D:

    \我的主页\个人简历.html">个人简历

      在编写html文件时,需要知道目标的url。

    如何才能得到目标的url呢?

    对于自己主机内的文件,它的url可以根据该文件的实际情况决定。

    对于Interner上的资源,我们在用浏览器观看时,它的url会在浏览器的Location一栏中显示出来,把它抄下来写到你的html文件中即可。

      在编写html文件时,对有能确定关系的一组资源(比如在同一个目录中)应采用相对url,这不仅简化你的html文件,而且便于维护。

    比如当你需要将某个目录整个搬到另外一个地方或把某一主机的资源移到另一台主机时,用相对url写的html文件用不看更新其中的url(只要它们的相对关系没有改变)。

    但如果你用绝对url编写html,你就不得不逐字修改每个链接指针中的url,这是一件很乏味也很容易出错的工作。

    对于各个资源之间没有固定的关系,比如你的html文件是介绍各大学情况的,它所指向的目标分布在全球的主机中,这时你就只能用绝对url了。

    二、练习:

    1、要A:

    \下新建一个主页,名为“index.html”,在给该主页加上标题名为“我的温馨小屋”,并在主页内显示H1标题的字“温馨小屋欢迎你”,在标题字的下面插入一幅图(可以在C:

    \素材文件夹中找),改变一下该站点的背景。

    2、在A:

    \下新建一个站点,名为“个人简历.html”,有如下内容:

    我的个人简历

    姓名:

    王星星

    性别:

    你看着办

    年龄:

    不详

    联系电话:

    110

    E—Mail:

    1234567890@

    QQ:

    8888888

    个人经历:

    **********************************************

     

    3、在要在“我的站点.html”的站点内的图下添加一文本“个人简历”,单击“个人简历”可链间到“个人简历.html”站点

    4、在A:

    \下新建一个站点,名为“我的相册.html”,在此站点内插入一些图片(至少四张)

    5、在要在“我的站点.html”的站点内的“个人简历”下添加一文本“相册”,单击“相册”可链间到“我的相册.html”站点

    三、作业:

    1、简述今天所学习的各种HTML语言标识的作用及使用方法?

    一、新授、练习

    1、建立简单的页面:

    你现在正在上网,一定去了不少站点吧!

    这些站点的页面都设计得非常精美,让你在浏览信息的同时,还可以得到美的享受。

    这么吸引人的页面,是怎么制作出来的呢?

    你想不想也做一个精美的个人主页呢?

    如果你的回答是肯定的,那我们就一起学一下FrontPage的使用。

    FrontPage是优秀的专业化站点设计软件之一,使用FrontPage你只要几分钟就可以建立一个自己的站点,这可是一件令人激动的事哟!

    2.页面的修饰

    你可能要问,在Internet上看到有许多站点上不仅有文字,还有图像、声音甚至视频。

    这又是怎么制作的呢?

    (1)首先,我们要启动frontpage2000来新建一个新站点

    步骤:

    单击任务栏上的“开始”按钮→“程序”→“Microsoftfrontpage”

    单击常用工具栏上的“保存”按钮

    在弹出的对话框中为新站点指定保存位置

    在文件名输入框中输入“页面1”,单击保存按钮,Frontpage会自动给它添加扩展名“.htm”,表示它是一个站点文件

    (2)怎么向站点中添加内容呢?

    单击空白站点,使光标移到新站点,输入文字“小馨向你问好”,拖动鼠标选中该文字,单击工具栏中的居中按钮,使该文字居中显示,并且设置字号为7号,使该文字放大,再为站点设置一个标题,在站点上右击鼠标右键→“站点属性”,单击“常规”选项卡,在标题框内输入:

    小馨的家。

    单击“确定”按钮,这样一个简单的页面就完成了,别忘了要先保存一下自己的作品呀。

    下面我们可以通过“文件”菜单→“在浏览器中预览”在浏览器中浏览一下自己做的站点啦!

     为了使站点更加丰富多彩,我们还可以在其中插入视频和音频特效。

    (3)下面我们在站点中插入一幅图片

    步骤:

    将光标定位在要插入图片的地方,“插入”菜单→“图片”→“来自文件”→在弹出的对话框中选择要插入的图片→单击“确定”按钮。

    下面给站点配上背景图,在站点上右击鼠标右键→“站点属性”,单击“背景”选项卡→单击“浏览”按钮,选择需要的背景图案文件,新站点就有背景了!

    别忘了要保存一下了。

    (4)如果你已经编辑好了多个站点,这些站点之间应该如何联系呢?

    这就是我们下面要学的知识—“超链接”,下面我们在创建一个页面叫“小馨的简历”,在该页面内输入一些相关的简历,然后保存起来。

    切换到刚才的站点,在图片下面加上文字“我的简历”,然后选中这四个文字,单击工具栏中的“超链接”按钮,在对话框中选择“小馨的简历”站点。

    然后保存一下修改过的站点。

    这时你就可以预览了,单击“我的简历”就可以进入“小馨的简历”的站点啦!

    (5)怎么给站点加上背景音乐呢?

    在站点上右击鼠标右键→“站点属性”,单击“常规”选项卡→单击背景音乐后的“浏览”按钮,选择需要的背景音乐,保存该站点,这样打开该站点时就会伴随着音乐啦!

    (6)视频的插入

    步骤:

    确定插入视频的位置

    单击“插入”菜单下的“高级”子菜单,在插件属性的对话框中,单击“浏览”按钮,选择视频文件(扩展名:

    .avi),单击“确定”按钮。

    保存一下该站点就可以看一下效果啦!

    3、让别人看到

    我们现在编辑的站点是一个个的文件,在Internet上的人怎么访问这个站点文件呢?

    我们只要将编辑好的站点上传到WEB服务器上,别人就可以通过URL地址访问这个站点了。

      在Internet上计算机、文件夹、文件等所有的资源都是用URL命名的。

    当输入的URL地址发送给WEB站点服务器之后,服务器就会做出响应,把指定的WEB文件发送给计算机的浏览器,我们就可以在浏览器中浏览WEB页了。

    比如我们在IE地址栏中输入洪恩公司的URL地址,单击“转到”按钮,就可以进入洪恩公司的站点。

      你可能要问,在地址栏中并没有写出要访问的文件名,为什么总是访问洪恩公司的第一个页面呢?

    是这样的,我们输入的URL虽然没有指定要访问洪恩公司站点的哪一个目录和文件,但WEB服务器会自动指定一个该WEB站点的页面,我们把这个页面称为WEB站点的主页,它的作用就好像是一个门,我们可以通过这个门进入站点的其他各部分。

    WEB站点总是由一个主页和许多从页组成的。

      好了,FrontPage的入门知识就讲到这里,如果要制作一个好的站点,还有许多知识要学习。

    在后面的教程里,我们会系统地教您FrontPage的使用。

    希望大家通过这些学习,能够自己设计出精美的站点。

    二、练习:

    把刚才所讲过的简单站点完成

    三、作业:

    1、简述图片的插入步骤?

    2、简述视频文件的插入步骤?

    3、简述超链接的作用及设置方法?

    一、新授:

    同学中大多数同学都上过网,在网上我们所看到的就是别人所编写的网页、网站、主页;那什么是网页、网站、主页呢?

    首先我们要知道,我们说的个人主页,说专业一点,应该说是个人网站。

    怎么说呢,因为一个网站,是由许许多多的网页,图片等等组成的,我们说的主页,其实是指这个网站的第一页。

    打个比方,回到家里,首先你会进入客厅(客厅等于主页),客厅里面有许多的装饰物(装饰物等于主页的内容),在客厅里休息了以后,你就会干其他事情,比如进厨房煮饭(厨房等于你的网站中的第二个网页),而厨房里就会有很多用具(厨房用具等于网站中第二个网页的内容)。

    如此反复下去,家里还有睡房,厕所,阳台等等,那你的网站中就会有第三个网页,第四个,第五个,甚至达到几千个。

    这样你能理解了吗?

    一个网站就等于一个家。

    当然我们家不是开大饭店的,没那么多房间:

    下面我们来讨论怎样创建站点

      创建页面最简单的方法就是单击FRONTPAGE“常用”工具栏的“新建”按钮。

    它的右方有一个向下的小箭头,它是用来选择要新建什么,可以用“新建”按钮新建网页、站点、文件夹和任务。

    默认状态下是新建网页。

      如果要新建站点,可以不用向下箭头键选择,而直接单击“新建”按钮。

    不过使用文件菜单的“新建”命令来新建站点能够有更大的选择。

    单击文件菜单的“新建”命令,选择“站点”,这时需要你输入网站的地址以及网站的名称。

    新建以后网站相当于是一个文件夹,该文件内有两个子文件夹:

    一个为private、一个为images;还有一个主页index.htm(一个网站只能有一个主页)双击index.htm文件打开该文件进行编辑主页。

    编辑主页

    (1)修饰文本

    怎样使文字更丰富、活泼呢?

    一个简单的方法就是使用“格式”工具栏,还可以使用“格式”菜单下的“字体”命令。

    (与Word的使用方法类似)

    字体设置:

    选上文字,打开格式工具栏的“字体”下拉列表框,在里面选择相应的字体就可以了。

    如果浏览网页的人使用的计算机没有设置的字体?

    浏览器会用系统默认的字体代替你设置的字体。

    不过,使用常用字体是一个好习惯。

    字号设置:

    在“格式”工具栏“字号”下拉列表框中选择相应字体就可以了。

    (2)项目符号和编号

    设计网页应该层次分明,结构清晰。

    这可以通过FRONTPAGE的列表功能解决。

      选中要列表的内容,单击“格式”工具栏上的“项目符号”按钮

    ,默认情况下,项目符号是一个小黑点。

    你也可以选择其它的项目符号,单击“格式”菜单,选择“项目符号和编号”命令。

    选择“图片项目符号”选项卡[图一],单击“浏览”按钮,点“剪贴画”,再点Web符号按钮,选择合适的图片,单击“确定”按钮。

    (3)插入水平线

    在网页中适时的插入水平线可以使层次分明。

    最简单的方法是插入水平线使需要分隔的部分分开。

    把插入点调整到插入水平线的位置,选择“插入”菜单的“水平线”命令。

    改变线条颜色,双击插入的线条,在弹出的“水平线属性”对话框里单击“颜色”下拉列表,选择相应的颜色,单击“确定”按钮。

      在对话框中有“窗口宽度百分比”和“像素”选项[图一],它们的作用是通过调整宽度数值设置线条的宽度,但是这个数值的单位却是由它后面的选择决定。

    比如现在选择的是窗口宽度百分比,就表示线条的宽度就是由它占所在浏览器窗口的宽度的百分比来决定的。

    如果我们选择像素就表示线条宽度是100像素。

    单击水平线,选中它。

    按ALT+ENTER键,直接进入水平线对话框,调整“线条高度”为5个象素,单击“确定”按钮。

    线条高度就变高了。

      水平线变化有限,装饰性不强。

    我们还可以插入更丰富的线条来修饰页面,那就是线条图像。

    线条图像就是一个特别狭长的图像。

    将水平线选中,按DEL键,将水平线删除,选择“插入”菜单的“图片”命令,单击“剪贴画”选项。

    选择“图片”选项卡,这里把FRONTPAGE提供的剪贴画按类别放在了下面的列表框中,选择“WEB框架”,选择小石头图像,单击“插入剪辑”按钮。

    由小石头构成的线条就插入完成了。

      如果想把线条缩短一点,可以在线条上单击鼠标右键,选择“图像属性”命令,打开“图片属性”对话框,选择“外观”选项卡,选择“指定大小”,将宽度的单位设置为百分比,将宽度调整为80,单击“确定”按钮。

    (4)插入时间标记

    在INTERNET上我们经常看到许多网页上都有一个最新更新日期,用来告诉用户页面上一次更新是什么时候,这是怎么做的呢?

    看完下面的部分你就知道了。

    时间标记当活动网页被重新编辑或自动更新之后,会自动改变。

    设置起来也很容易:

    在页面末尾输入:

    “更新时间”,执行“插入”菜单的“日期与时间”命令,在“日期时间属性”对话框中选择“该网页上次编辑日期”,如果要改变日期的格式,可以单击“日期格式”下拉列表,选择合适的格式。

    (5)插入注释

    怎么在网页里插入注释呢?

    (在我们创建编辑和修改网页的过程中,经常需要插入一些文字,表明设计的意图和方法,在编辑网页时作为参考和提示,这就是注释。

      插入注释的方法是:

    普通模式下单击当前网页要插入注释的位置,把插入点设置到那里。

    选择“插入菜单”的“注释”命令,这样就会弹出“注释”对话框,在“注释”文本框中输入注释的内容,单击“确定”按钮。

     在指定的位置注释出现了。

    现在单击“预览”选项卡,切换到预览模式,注释没有出现。

    实际上注释并不是在浏览器中显示的网页的一部分,浏览者通过浏览器是看不到网页里的注释的。

    (6)插入特殊符号

    1、单击Web页中要插入符号的位置,放置光标。

    2、从“插入”菜单中选择“符号”。

    3、单击要插入的符号。

    单击其他的符号,您可以一次插入多个符号。

    4、单击“插入”。

    5、单击“关闭”,关闭“符号”对话框。

    (7)更改Web页颜色

    虽然默认的Web页颜色常常能够满足需要,但有时您还是需要更改Web页的颜色,以增加可读性或与您的图像颜色相匹配。

    

    更改颜色

    1.打开要添加背景颜色的Web页。

    2.在“格式”菜单中选择“背景”。

    3.从下拉列表框中选择需要的颜色。

    4.单击“确定”。

    指定背景图像

    1.打开要添加背景图像的Web页。

    2.在“格式”菜单中选择“背景”。

    3.选中“背景图片”复选框。

    4.在文本框中键入图像名和位置,或单击“浏览”来定位文件。

    5.单击“确定”。

    (8)应用边框与阴影

    通过使用FrontPage的“边框与阴影”工具创建环绕的边框,您可以强调任意段落或对象。

    创建边框

    1.选定一个段落或图像。

    2.从“格式”菜单中选择“边框与阴影”。

    3.单击一个“边框”设置,然后选择需要的边框样式。

    4.指定边框的宽度。

    5.要关闭部分边框,您可以单击“预览”区域中的相应按钮。

    6.单击“阴影”选项卡,然后选择需要的颜色。

    7.根据需要,单击“浏览”,指定背景图像。

    8.单击“确定”。

    二、练习:

    1、根据所给的F4的素材,制作一个F4相关的网站,并编辑主页。

    三、作业:

    1、简述frontpage2000中站点的新建方法?

    并且简述什么是站点、网页、主页?

    2、网页中水平线的插入步骤?

    3、网页中特殊符号是如何插入的?

    4、如何设置网页的背景颜色或图像?

    插入图像

    如果您曾经使用过MicrosoftWord,并在其中插入过图像,您将会发现这一过程在FrontPage中也非常相似。

    在大多数情况下,您可以在Web页文档中单击一个位置,放置光标,然后再单击“插入图片”工具栏按钮来插入图像。

    插入图像

    1.1.        单击鼠标左键,将光标置于要插入图像的位置。

    2.2.        单击“插入图片”工具栏按钮。

    3.3.        双击包含要插入的图像的文件夹,或在URL文本框中键入图像的URL,指定WorldWideWeb上的图像。

    4.4.        从列表框中选择图像。

    5.5.        单击“确定”,插入图像。

    插入来自剪贴画的图像

    1.1.        单击鼠标左键,将光标置于要插入图像的位置。

    2.2.        单击“插入图片”工具栏按钮。

    3.3.        单击“剪贴画”。

    4.4.        单击一个类别。

    5.5.        单击要插入的图像。

    6.6.        单击弹出式菜单中的“插入剪辑”按钮。

    添加图像超级链接

    图像并不只是使网页整齐。

    它们可以附加超级链接。

    当访问者单击图像时,可以打开与该图像相关的Web页或Web站点。

    创建指向当前Web中的页面的超级链接

    1.1.        单击一个图像,将其选定。

    2.2.        单击“插入超链接”工具栏按钮。

    3.3.        在列表框中定位Web页。

    4.4.        单击“确定”。

    创建指向Internet资源的链接

    1.1.        单击一个图像,将其选定。

    2.2.        单击“插入超链接”工具栏按钮。

    3.3.        在URL框中键入Internet资源的URL,或者单击WorldWideWeb按钮,使用浏览器来定位Internet资源。

    4.4.        单击“确定”。

    测试图像链接

    1.1.        单击FrontPage中的“预览”选项卡。

    2.2.        单击具有超级链接的图像。

    此时,FrontPage会显示图像链接到的网页。

    一、新授:

    表单的使用

    表单使您可以收集来自站点访问者的信息。

    要使用表单,访问者只需在表单域中键入信息,单击一个将信息提交给Web站点服务器的按钮,然后服务器根据表单处理程序的指令来收集和处理信息。

    所有的MicrosoftFrontPage表单都具有以下几个基本的元素:

    u      询问或请求信息;

    u      访问者在其中键入信息的域;

    u      提交和全部重写按钮,允许访问者控制他(她)是否提交或清除表单;

    u      与表单相关的表单处理程序,控制对访问者的输入所做的反应。

    值得注意的是,为了使用表单或处理表单数据,FrontPage不要求创建计算机编程脚本。

    (当Web站点中包括表单时,通常是这样的情况。

    )FrontPage创建了自动处理表单的脚本。

    然而,您的Web服务器需要支持FrontPage服务器扩展。

    1、您可以创建意见反馈和用户注册表单,收集来自访问者的各种类型的信息。

    使用意见反馈表单收集有关站点、服务或产品的反馈信息。

    使用用户注册表单,便于访问者注册他们自己,以访问Web站点。

    创建意见反馈表单

    1)从“文件”菜单中选择“新建”,然后从子菜单中选择“网页”。

    2)从列表框中选择“意见反馈表单”。

    3)单击“确定”。

    4)自定义表单的文本、注释或表单域。

    创建用户注册网页

    1)从“文件”菜单中选择“新建”,然后从子菜单中选择“网页”。

    2)从列表框中选择“用户注册”。

    3)单击“确定”。

    4)自定义表单的文本、注释或表单域。

    “表单网页向导”加速了表单的创建,并提供表单模板用于您可能希望重复使用的表单。

    向导不仅为您创建表单,而且还将合适的表单处理程序附加到表单中。

    使用表单网页向导

  • 展开阅读全文
    相关资源
    猜你喜欢
    相关搜索

    当前位置:首页 > 法律文书 > 调解书

    copyright@ 2008-2022 冰豆网网站版权所有

    经营许可证编号:鄂ICP备2022015515号-1