标记语言与网页制作.ppt
- 文档编号:18434890
- 上传时间:2023-08-18
- 格式:PPT
- 页数:65
- 大小:711KB
标记语言与网页制作.ppt
《标记语言与网页制作.ppt》由会员分享,可在线阅读,更多相关《标记语言与网页制作.ppt(65页珍藏版)》请在冰点文库上搜索。
大学计算机基础,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,第1章计算机基础知识第2章操作系统第3章办公自动化软件第4章多媒体技术及其应用第5章计算机网络基础第6章互联网及其应用第7章标记语言与网页制作第8章国民经济与社会信息化,目录,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,第7章超文本标记语言HTML,万维网联盟(W3C)和SGML什么是HTML超文本标记语言HTML规范HTML标记语法和文档结构文件头及相关标记文件体及相关标记属性文档内容常用标记表格(table)表单(form)帧(frame)显示样式与层叠样式表CSS技术,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,7.1标记语言及其发展,标准通用标记语言SGML(StandardGeneralizedMarkupLanguage)超文本标记语言HTML(HypertextMarkupLanguage)扩展HTML规范XHTML扩展标记语言XML,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标准通用标记语言SGML,标准通用标记语言SGML(StandardGeneralizedMarkupLanguage)一个用来定义在电子表格中如何对文件的结构和内容进行描述的国际标准(ISO-8879)1969年,IBM公司的研究人员开始设计一种名为GML(GeneralizedMarkupLanguage)的语言,在印刷、统计等需要大规模数据处理的行业和部门应用1980年推出了SGML(StandardGeneralizedMarkupLanguage)语言SGML设计非常复杂,正式规范多达500多页SGML定义了标记语言的基本概念,奠定了标记语言的技术基础1991年,HTML(HypertextMarkupLanguage)问世,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,超文本标记语言HTML,HTML(HyperTextMarkupLanguage)语言起源于通用标准标记语言SGML,由cern(欧洲粒子物理实验室)于1991年首先提出。
HTML定义了一组标记符号(tag),用于对文件的内容进行标注,标记内容的输出格式,如字体大小、颜色,背景颜色,表格形式,各部分之间逻辑上的组织等。
HTML文件包含了文档数据和标记两部分,其中文档数据是显示在WWW浏览器中的数据内容,标记则规定了这些内容在浏览器中以何种格式、样子呈现给用户。
HTML规范及其发展HTML2.0(1996)HTML3.2(1997)HTML4.0Specification(1998,2.24)HTML4.01Specification(1999,12.24)可扩展HTML(XHTML)(2000.1.20)XHTML1.0建立在HTML4.0基础上,是一个格式符合xml规范的语法更加严格的html。
HTML浏览器支持html的浏览软件,可以按照HTML规范显示html文档,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,可扩展XHTML规范,HTML规范的不足不能适应现在越来越多的网络设备和应用的需要,比如手机、PDA、信息家电都不能直接显示HTML;由于HTML代码不规范、臃肿,浏览器需要足够智能和庞大才能够正确显示HTML;数据与表现混杂,页面要改变显示,就必须重新制作HTML。
XHTML规范2000年底,W3C制定了可扩展HTML,W3C的工作重点已经集中在XHTML,它是HTML向XML过度的一个桥梁。
2000年1月20日发布XHTML1.0,XHTML1.0是HTML4.01基于XML的形式。
2002年8月,XHTML2.0,取消向后兼容,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,相关技术,DHTML技术DHTML不是一种标准或规范DHTML是一种将目前已有的网页技术、语言标准整和运用,制作出能在下载后仍然能实时变换页面元素效果的网页的设计概念。
HTML4.0规范客户端脚本语言CSSL文档对象模型DOM层叠样式表单CSS技术SHTML技术SHTML不是一种HTML规范,而是一种网站设计、开发与维护技术服务器端包含指令(ServerSideInclude,SSI),高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,7.2超文本标记语言HTML规范,HTML标记语法和文档结构文件头及相关标记文件体及相关标记属性文档内容常用标记表格(table)表单(form)层次块标记对象和脚本程序标记层叠样式表CSS技术帧(frame),高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,HTML标记语法,标记(Tag)标记由封装在小于号()构成的一对尖括号之中,标记一般分首标记和尾标记,它们成对出现。
例如:
textwithunderline开始标记,开启标记结束标记,关闭标记标记类型单标记,例如:
双标记,例如:
标记属性例如:
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,HTML文档结构,文档结构,文档头,文档体,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,文件头及相关标记,标记标记标记标记标记标记注释标记,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记,一般形式各种子标记脚本语言定义的函数或变量说明功能开启()和结束()文件头标记文件头部分的内容不在网页中显示属性无,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记,一般形式网页标题文本例如:
欢迎光临GSL网站功能用于标识网页主题,其中的内容将在浏览器的标题栏中显示,不出现在页面内。
属性无,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记(举例),HTML文档代码欢迎光临GSL网站,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记,一般形式功能文件头标记内的一个辅助性标记对于网页被搜索引擎检索、提高网页在搜索列表的排序起着关键的作用,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记name属性,一般形式功能name属性主要用于描述网页,与之对应的属性值为content,content中的内容主要是便于搜索引擎查找信息和分类信息用的。
name属性值keywords(关键字),keywords用来告诉搜索引擎该网页的关键字是什么。
description(网站内容描述),description用来告诉搜索引擎网站的主要内容author(作者),标注网页的作者。
robots(机器人向导),robots用来告诉搜索机器人需要索引的页面有哪些。
content的参数有all、none、index、noindex、follow、nofollow。
默认是all。
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记http-equiv属性,一般形式功能http-equiv属性,http-equiv相当于HTTP的文件头作用,可以向浏览器传回一些有用的信息,以帮助正确显示网页内容。
http-equiv属性主要的参数有:
http-equiv属性值content-type(显示字符集的设定),设定页面使用的字符集。
expires(期限),用于设定网页的到期时间。
pragma(Cache模式),禁止浏览器从本地计算机的缓存中访问页面内容。
refresh(刷新),自动刷新并指向新页面。
window-target(显示窗口的设定),强制页面在当前窗口以独立页面显示。
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记,功能标记定义文档的基础URL地址,在文档中所有的相对地址形式的URL都是相对于这里定义的URL而言的。
属性href属性,href属性指定了文档的基础URL地址,该属性在标记中是必须存在的。
例如:
target属性,target属性同框架一起使用,它定义了当文档中的链接被点击后,在哪一个框架中展开页面。
如果文档中超级链接没有明确指定展开页面的目标框架集,则就使用这里定义的地址代替。
_blank,表明在新窗口中打开链接指向的页面。
_top,在链接所在的完整窗口中展开页面。
_self,在当前文档的框架中打开页面。
_parent,在当前文档的父窗口中打开页面。
例如:
表明页面上所有的链接都在新窗口打开。
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记,功能标记定义文档之间的包含。
在HTML的头部可以包含任意数量的标记。
属性href,href属性值指向链接资源所在的URL,其中url是链接的地址。
type,type属性用于指定被包含的媒体类型title,title属性值为一个字符串,用于描述该链接关系。
rel,rel属性定义了文档和所链接资源的链接关系,可能的值包括:
stylesheet,alternatestylesheet,start,next,prev,contents,index,glossary,copyright,chapter,section,subsection,appendix,help,和bookmark等。
如果希望指定不止一个链接关系,可以在这些值之间用空格隔开。
rev,rev属性定义了文档和所链接资源之间的反向关系。
其中linktype表明链接类型,其可能的取值同rel属性相同。
例如:
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标记,功能可让某些WebServer寻找网页内的关键字,若WebServer提供这样的寻找功能,客户端浏览器也支持寻找功能,在载入网页时会看到一个简单的寻找。
一般形式例如:
属性无,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,文件体标记及其属性,文件体标记各内容标记属性一般属性事件属性,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,文件体标记及其属性(Cont.1),文件体标记一般属性,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,文件体标记及其属性(Cont.2),文件体标记事件属性支持20多个事件属性,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,文档内容常用标记,文件体标记的子标记标题、段落标记文本格式标记图像标记超链接标记影像地图标记层次块标记多媒体标记标记和标记注释标记其它标记,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,标题、段落标记,标题标记段落标记回车换行标记水平线标记标记属性一般属性事件属性,标记事件属性,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,文本格式标记,字体标记粗体标记斜体标记下划线标记删除线标记、标记、标记标记属性略例如:
字体标记一,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,图像标记,图像标记图像标记为单标记,用以插入图像及设定图像属性标记属性align:
是指定图像的位置id,指定的id号class:
指定图像所属的类型name:
用于设定图像的名称。
src:
规定插入的图像的url地址,也就是含路径的图像文件名title:
设定图像的标题alt:
表示图像的替代文字border:
设定图片的边框height和width:
分别用于指定图像的高度和宽度hspace和vspace:
分别用于设定图像的左右边框大小和上下边框大小ismp和usemap:
在应用图像地图(map)时使用,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,图像标记(Cont.),标记属性dynsrc:
指定要下载的影像片断的url地址controls:
设定影像播放的控制接钮start:
设定何时开始播放影像片断FileopenMouseoverloop:
指定影像片断的播放次数事件属性有20多个鼠标和键盘事件属性,分别是:
onload,onclick,ondbclick,onmouseover,onkeydown,onkeypress等,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,超链接标记,一般形式标记超链接类型文本超链接图像超链接影像地图定义书签书签文本标记属性target属性,定义超链接打开的目标窗口title属性,属性值为一字符串,鼠标指向超链接时,鼠标右下角显示标题文本,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,超链接标记举例,举例ShandongTravel美丽的山东美丽的泉城美丽的海滨城市-青岛主要旅游网,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,影像地图标记,影像地图标记热点标记,为单标记举例,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,走马灯标记,功能标记一行或多行滚动的文本,各主流浏览器,如IE,Maxthon,Firefox等均支持标记属性align属性,设定活动字幕的位置bgcolor属性,设定活动字幕的背景颜色direction属性,设定活动字幕的滚动方向,取值可以是left、right、up或down。
behavior属性,设定滚动的方式,主要由三种方式:
behavior=“scroll”表示由一端滚动到另一端;behavior=“slide”表示由一端快速滑动到另一端,且不再重复;behavior=“alternate”表示在两端之间来回滚动。
scrolldelay属性,用于设定滚动两次之间的延迟时间loop属性,用于设定滚动的次数,当loop=-1表示一直滚动下去,直到页面更新。
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,走马灯标记(举例,动态新闻效果活动字幕内容第一行活动字幕内容第一行活动字幕内容第一行,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,注释标记,功能用于在HTML文当中书写说明性文字,注释文字可以多行,内容在浏览器中不显示。
一般的形式,,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,表格,标记表格标记行标记列标记列标题标记表格标题标记举例,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,表格(举例),在浏览器中的显示结果,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,表单(From),功能人机交互主要标记表单标记text单行文本框控件PasswordButtonRadioCheckbox和imageHiddenFilesubmit/reset,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,表单标记,功能用来标记一个表单,即定义表单的开始和结束位置属性name属性,给出表单的名称,常常用于脚本编程action属性,action的值是表单处理程序的网络路径和程序名method属性,method属性用来定义服务器表单处理程序从表单中获得信息的方式get方法,将数据打包放置在环境变量QUERY_STRING中作为URL整体的一部分传递给服务器POST方法,分离地传递数据给服务器表单处理程序,不需要设置QUERY_STRING环境变量,有更好的安全性,表单中数据的多少是任意的target属性,target属性用来指定目标窗口或目标帧,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,输入控件类型标记,功能用来定义用户输入区,无尾标注。
一般形式是:
属性type属性,给出控件的类型,常用的类型有:
text,TEXTAREA,Radio,Checkbox,Button。
,Image,Hidden,Password,FileSubmit/Reset。
name属性,name属性给出输入控件的名字value属性,保存用户的输入和选择,服务器就是通过调用输入区域的value属性值来获得该区域的数据,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,单行文本框输入标记,功能输入单行文本一般形式是:
属性name属性,name为文本框的名称,便于程序获取用户输入value属性,value属性存储文本框的初始值size属性,Size属性表示文本框的显示长度maxlength属性,maxlength是文本框中输入的有效数据长度举例:
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,密码文本框输入标记,功能输入密码,不显示输入内容一般形式是:
属性举例:
密码:
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,多行文本框输入标记,功能输入多行文本,双标记一般形式是:
属性name属性,name为多行文本框的名称,便于程序获取用户输入。
rows属性和cols属性,分别用来设置文本框的列数和行数,列与行以字符数为单位。
举例,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,button按钮输入标记,功能一般形式是:
属性name属性,name为按钮名称,便于程序对按钮的操作。
value属性,value为按钮的显示名称。
其他鼠标和键盘事件属性举例,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,radio单选钮输入标记,功能单选钮,往往是若干个radio为一组。
每一个radio必须且仅有一个value,通常有两个或以上radio具有相同的name,但不同的value,从而选择其中之一。
一般形式是:
属性name属性,单选扭的名称,一般是若干个radio一组,取相同的name。
checked属性,用来设置该单选框缺省时是否被选中,相同name的多个Radio中只能有一个选择,或都不使用该参数。
value属性,存储单旋钮的取值,多个具有相同name的单旋钮应该具有不同的value。
举例,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,radio单选钮输入标记(举例),举例结果,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,复选框输入标记,功能复选框是对某种输入做出“是”或“否”的选择一般形式是:
属性name属性,name为复选框的名称,便于程序获取用户输入。
value属性,每一个Checkbox必须有一个value,当复选框选中value值便会传到表单的action属性指定的程序中。
checked属性,用来设置该复选框缺省时是否被选中。
举例,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,复选框输入标记(举例),举例显示,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,复选列表框输入标记,功能一般形式是:
标记属性name属性,name为下拉式列表控件名称size属性,下拉式列表的高度,缺省时值为1,若没有设置(加入)multiple属性,显示的将是一个弹出式的列表框。
若使用此参数则不会有PopUp效果。
如果小于可选的项目数量,则出现垂直滚动条。
multiple属性,指定是否可以多选。
multiple属性不用赋值,直接加入标记中即可使用,加入了此属性后列表框就成了可多选的了,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,复选列表框输入标记(Cont.),标记指定列表框中的一个选项,它放在标记对之间标记属性value属性,用来给指定的那一个选项赋值selected属性,selected用来指定默认的选项,一个下拉是复选框可以有一项或零可内定被选。
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,复选列表框输入标记(举例),举例,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,image按钮标记,功能取代submit/reset两个默认的按钮一般形式属性name属性,所要代表的按键,可以是submit、reset或其它。
src属性,设置按钮图片,如果按键图片文件不与该html文件在同一目录下,需要加上正确的相对或绝对途径举例,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,隐藏元素标记hidden,功能hidden为定义隐藏表单的元素,它在网页上并不显示,不需要用户输入,只是随表单一起传给表单的action属性指定的程序,用于为网页处理程序传送数据。
一般形式属性name属性为控件名称,便于程序获取用户输入。
value属性存储输入元素的默认值。
举例当表单提交后,服务器程序可以获得myID的值是730118,从而实现传送数据的目的。
高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,文件上传标记,功能通过HTTP协议上传文件。
一般形式属性举例显示结果,高等教育“十一五”国家级规划教材大学计算机基础高等教育出版社ISBN:
978-7-04-024268-3,表单提交/重填按钮标记,功能将表单数据传送到服务器端,由表单标记中的action属性指定的服务器上的程序处理用户输入数据。
一般形式表单提交,重填按钮,属性name属性,这和其它控件的属性不同,在提交表单中,name可以指定一个函数,需要和form标记中action属性的程序配合。
一般情况下,不需要na
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 标记 语言 网页 制作