您好,欢迎访问三七文档
当前位置:首页 > 商业/管理/HR > 信息化管理 > frontpage课件
1、1/72FrontPage20032/721、常用网页制作软件介绍2、、HTML语言简介4、FrontPage2003应用主要内容3/721.常用网页制作软件介绍1.1什么是网页用HTML语言编写的文件称为HTML文件,以页面的形式呈现在用户的屏幕上。4/72(1)Dreamweaver:所见即所得的网页编辑工具;(2)Fireworks:针对网络图形设计的工具软件;(3)Flash:矢量图形编辑和交互式动画制作软件;1.2网页制作常用软件网页三剑客11.常用网页制作软件介绍5/72FrontPage2003是微软公司最近推出的MicrosoftOfficeSystem套装软件的重要组成部分。FrontPage是一款所见即所得的网页制作软件,该软件以其强大的向导功能和简单易用而著称;1.2网页制作常用软件FrontPage200321.常用网页制作软件介绍6/722.网站存放网页的服务器。2.2网址网页的地址。基本结构:服务器\目录\文件名7/722.3常见的三种网页ASP(ActiveServerPages)JSP(JavaServerPages)PHP(HypertextPrep。
2、rocessor)2.(超文本标记语言)是网页技术的基础,它使用一些约定的标记(tag)对文本进行标注,定义网页的数据格式,描述Web页中的信息,控制信息的显示。HTML语言编写的文件称为HTML文件。用HTML语言编写的网页实际上是一种文本文件,它以.htm或.html为扩展名,可以使用任何文本处理软件(例如:记事本)编写。3.HTML语言简介9/72例1-文本布局示例3.HTML语言简介10/72初识HTML:例3-表格示例3.HTML语言简介11/723.2HTML文件的基本构成(1)文本内容:含有需要展现的具体信息。(2)HTML标记:负责控制文本显示的外观和版式。3.HTML语言简介12/723.3HTML标记的书写格式(1)<标记名>文本内容</标记名>(2)<标记名属性1=值1属性2=值2…>文本内容</标记名>3.HTML语言简介标记名写在“”内。多数HTML标记同时具有起始和结束标记,并且成对出现。HTML标记不区分大小写。其中标记名和属性之间用空格分隔。如果标记有多种属性,属性之间也要用空格分隔。13/723.4HTML网页的结构(1)头部(Head):由head和。
3、/head标记定义。(2)正文主体(Body):由body和/body标记定义。3.HTML语言简介3.HTML语言简介3.5HTML网页的文本布局标记一般HTML文件都是以html开头,以/html结束。1)头部(Head)HTML文件的头部由head和/head标记定义。title…/title,它用于定义网页文件的标题。2)正文主体(Body)由body和/body标记定义。bodybgcolor=#ncolor=#n…/body其中,bgcolor为背景颜色,color为文本颜色。n为六位十六进制数。如果网页使用背景图像,格式如下:bodybackground=路径/图片文件名…/body3.HTML语言简介•1.文本布局1)段落标记pp…/p标记指定文档中一个独立的段落。align属性,控制段落的对齐方式,其值可以是left、center、right、justify,分别表示左对齐、居中、右对齐和两端对齐,默认值为左对齐。palign=对齐方式…/p2)换行标记brbr标记可以强制文本换行。该标记只有起始标记。3)水平线标记hr水平线标记hr用于在网页中插入一条水平线。hrw。
4、idth=宽度size=高度align=对齐方式案例回顾3.HTML语言简介2.文字格式1)标题标记hnhn属性=属性值标题文字内容/hn其中n取值范围为1到6的数字。其中h1文字最大,h6文字最小。2)字形标记字形标记用于设置文字的粗体、斜体、下划线、上标、下标等。标记格式字形结果B…/B粗体I…/I斜体U…/U下划线SUP…/SUP上标SUB…/SUB下标3.HTML语言简介3)字体标记font(1)size属性:用来控制文字的大小fontsize=n…/fontn的取值范围为1~7的数字,默认值为3。font标记和hn标记都可以控制文字的大小。一般情况下,文章的标题最好由hn标记控制,而其余的文字由font标记控制。(2)color属性:用来控制文字的颜色fontcolor=#n或英文表示的颜色…/font其中n是一个十六进制的六位数。(3)face属性:用来指明文字使用的字体fontface=字体名…/font其中字体名的选择由Windows操作系统安装的字体决定。如:宋体、楷体_GB2312、TimesNewRoman、Arial等。3.HTML语言简介3.插入图片img标记。
5、将图片插入网页中,用于设置图片的大小以及相邻文字的排列方式。(1)src属性:指明图片文件所在的位置。imgsrc=URL其中URL指图片文件存放的位置。(2)alt属性:图片的文字说明,当鼠标指针指向图片时,该图片的说明性文字弹出。imgsrc=URLalt=说明文字(3)width和height属性:设置图片显示区域的宽度和高度。imgsrc=URLwidth=n1height=n2其中width和height属性的取值n1和n2,可以是像素数或百分比。3.HTML语言简介(4)border属性:设置图片文件的边框。imgsrc=URLborder=n其中n为像素数。(5)align属性:设置图片相对于文本的位置关系。imgsrc=URLalign=对齐方式对齐方式可以是:top(顶端对齐)、middle(相对垂直居中)、bottom(相对底边对齐)、left(左对齐)、right(右对齐)、texttop(文本上方)等。3.HTML语言简介4.插入超链接a和/a标记用于设置网页中的超链接,href属性指明被超链接的文件地址。ahref=URL超链接文本/a用于表示超链接的文本一般。
6、显示为蓝色并且加下划线。若使用图片做超链接:ahref=URL1imgsrc=URL2/a案例回顾3.HTML语言简介5.使用表格定义表格的有关标记如下:table…/table定义表格区域。caption…/caption定义表格标题。th…/th定义表格头。tr…/tr定义表格行。td…/td定义表格单元格。border属性用于设置表格边框的宽度;width、height属性用于设置表格或单元格的宽度、高度;cellspacing和cellpadding属性分别用于设置单元格之间的间隙和单元格内部空白;align属性用于设置表格或单元格的对齐方式;bgcolor和background属性分别用于设置表格的背景颜色和背景图像。22/723.HTML语言简介例1-文本布局示例23/72例2-HTML网页的其它标记3.HTML语言简介24/72例2-HTML网页的其它标记3.HTML语言简介25/72初识HTML:例3-表格示例3.HTML语言简介26/724.FrontPage2003应用FrontPage2003建站欣赏27/724.FrontPage2003应用4.1FrontPa。
7、ge2003的界面标题栏菜单栏常用工具栏格式工具栏视图栏标记栏工作区4.FrontPage2003应用FrontPage2003提供了四种网页视图模式:–设计视图–代码视图–预览视图–拆分视图29/724.FrontPage2003应用4.2创建站点站点是指一个专门用来存放网站文件的文件夹,需要一个名字和一个根目录,以后所有站点的文件都将存放在这个根目录下。30/724.FrontPage2003应用4.2创建站点站点的创建有以下几种方法:利用向导创建利用模板创建12自定义站点34.FrontPage2003应用“文件”---“新建”----“新建”任务窗格中----“新建网站”----“由一个网页组成的网站”----“网站模板”----“指定新网站的位置”。32/721234564.3网站视图网页视图是FRONTPAGE最常用的视图,网页的创建、编辑、预览等都在该视图中进行。文件夹视图下,站点显示为一组文件和文件夹,可在此视图中创建、移动和删除文件或文件夹。报表视图可以方便的了解当前站点的文件内容、更新链接情况、组件错误,所有文件列表及变化情况。导航视图可以方便地观察站点的链接结构,。
8、以层状组织结构图得形式显示。超链接视图将当前站点显示为链接文件的一个网络,它就象一张地图,表明站点中的超级链接任务视图主要用来创建和管理任务,列出了当前站点尚未完成的任务。4.FrontPage2003应用33/72新建:“文件”----“新建”----“新建”任务窗格----“新建网页”----“其他网页模板”。打开:“文件”----“打开”或“常用”工具栏的“打开”按钮,在弹出的“打开文件”对话框中选择相应的网页;如需要打开的文件已在打开的网站中,在文件夹视图中双击该网页图标即可将其打开。保存:“文件”---“保存”或“常用”工具栏的“保存”按钮,如需另存可使用“文件”菜单的“另存为”命令。4.4创建网页4.FrontPage2003应用4.FrontPage2003应用设置文字格式:选中文字---“格式”--“字体”命令。虽然可以设置各种美观的字体,但是由于用户只能使用本地计算机中安装的字体显示网页,因此还是使用常见的字体为好。查找、替换、复制、剪切!设置段落格式按Enter键划分段落。段落之间插入了一个空行。如果只是需要换行,而不是另起一个段落,按Shift+Enter键。
9、即可。按Enter键在HTML代码中插入的是p标记,而按Shift+Enter键则插入的是br标记。4.FrontPage2003应用网页的属性设置设计状态下“文件”---“属性”单击右键选择“属性”36/724.5查看、编辑源代码4.6预览所编辑的网页在FrontPage2003中预览网页1在浏览器中预览网页24.FrontPage2003应用37/724.7网页中元素的插入插入水平线14.FrontPage2003应用“插入”----“水平线”修改:双击水平线选中水平线右键水平线属性38/724.7网页中元素的插入插入图像24.FrontPage2003应用“插入”----“图片”设置图片属性双击图片选中图片-----格式-----属性选中图片右键图片属性编辑图片利用图片工具栏旋转等39/724.7网页中元素的插入插入字幕34.FrontPage2003应用将插入点设置在要插入移动字幕的位置或者选中作为移动字幕的文本“插入”----“Web组件”---“插入Web组件”----“组件类型”----“动态效果”---“字幕”---“完成”40/724.7网页中元素的插。
10、入插入交互式按钮44.FrontPage2003应用“插入”----“Web组件”----“组件类型”----“动态效果”----“选择一种效果”----“交互式按钮”----“完成”设置按钮字体图像链接41/724.7网页中元素的插入插入站点计数器54.FrontPage2003应用“插入”----“Web组件”----“插入Web组件”-----“组件类型”----“计数器”-----“选择计数器样式”-----“完成”----“计数器属性”42/724.8超级链接建立文本超级链接14.FrontPage2003应用(1)选定要定义超链接的文本,“插入”---“超链接”命令,或单击“常用”工具栏上的“超。
本文标题:frontpage课件
链接地址:https://www.777doc.com/doc-5709898 .html