超媒體與Web系統_第1頁
超媒體與Web系統_第2頁
超媒體與Web系統_第3頁
超媒體與Web系統_第4頁
超媒體與Web系統_第5頁
已閱讀5頁,還剩123頁未讀 繼續免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

第7章超媒體與Web系統7.1超文本和超媒體概念7.2超文本和超媒體系統7.3超文本和超媒體應用7.4存在問題及發展前景1第1頁7.1超文本和超媒體概念超文本和超媒體主要特點訪問方式和系統特征超文本與超媒體示例2第2頁超文本與超媒體

能不能像人類思維那樣以經過“聯想”來明確信息關聯性?信息爆炸現有信息存放與檢索機制造成:信息不能被全方面而有效利用矛盾比文本更高一層次信息管理技術,“超文本”3第3頁

文本(Text)是什么?

文本是我們最熟悉信息表示方式。文章、程序、書、文件等都以文本出現,通常以字、句子、段落、節、章作為文本內容邏輯單位,而以字節、行、頁、冊、卷為物理單位。什么是超文本(一)4第4頁文本線性結構文本最顯著特點是它在組織上是線性和次序。這種線性結構表達在你讀文本時只能按固定線性次序一字一字、一行一行、一頁一頁地讀下去。5第5頁什么是超文本(一)

文本特點

比如:“英會我文講”這句話是無結構;而“我會講英文”就是有結構一句話。線性文本

作為一個線性組織表現出貫通主題單一路徑。線性次序6第6頁什么是超文本(二)不過人類記憶互聯網狀結構就可能有各種路徑,不一樣聯想檢索必定造成不一樣路徑。比如:某人對“夏天”一詞可能產生下面一系列聯想結果。

夏天→太陽→星星→天文學→望遠鏡→伽利略→比薩→斜塔→佛教→和尚……夏天?????7第7頁什么是超文本(三)“夏天”產生聯想能夠是千差萬別夏天→游泳→大海→魚→吃飯→飯盒→餐具→銀器→耳環→婚禮→婚紗→白雪…“聯想”網狀結構用純文本是無法管理!

必須采取一個比文本更高一層次信息管理技術,即超級(Hyper)文本(Text)。8第8頁什么是超文本(四)

超文本結構不是次序

它類似于人類聯想記憶結構,采取一個非線性網狀結構:

節點基本信息塊鏈自然關聯9第9頁小型超文本示例

A節點B節點C節點D節點E節點F節點6個節點和9條鏈組成超文本結構10第10頁超文本主要特點

沒有固定次序,也不要求讀者必須按某個次序來閱讀。

用戶能夠主動地決定閱讀節點次序。11第11頁早期超文本系統表現形式僅是文字,這就是它被稱為“TEXT”原因。

超媒體不但能夠包含文字,而且還能夠包含聲音、圖形、圖像、動畫和視頻片段,這些媒體之間也是用超級鏈接組織,而且它們之間鏈接也是錯綜復雜。超媒體12第12頁多媒體、數據庫與超文本/超媒體多媒體超文本數據庫超媒體超文本數據庫超媒體數據庫多媒體數據庫13第13頁超媒體含有以下特點:各種媒體信息網絡結構形式交互特征

14第14頁超文本和超媒體訪問方式

超文本和超媒體系統特征

超文本和超媒體是一個經典數據庫技術由節點和表示節點之間關系鏈組成網。每個節點都鏈接在其它節點上,用戶對網進行瀏覽、查詢和注釋等操作。15第15頁

超文本和超媒體訪問方式決定于其內部結構。

超文本是一個接口模型,它采取“控制按鈕”方式組織接口。“按鈕”由作者設置在正文中,用戶經過按鈕訪問下面信息“鏈”訪問方式16第16頁(1)內容多媒體化(2)網狀信息結構更它靠近現實世界(3)屏幕中窗口和數據庫中節點含有對應關系。

超媒體系統基本特征超媒體三要素:節點、鏈、網絡17第17頁(4)便于設計者修改、編輯節點和鏈(5)便于用戶進行瀏覽和查詢(6)具備良好擴充功效,接收不停更新超媒體管理和查詢技術。

從交互性角度:18第18頁超媒體系統特征:多媒體化交互性19第19頁超文本與超媒體示例

1、操作系統Windows中“幫助”就使用了超文本方式2、電子百科全書、3、教學應用CAI4、旅游信息、軟件工程、20第20頁詳細示例1假設有一位總經理,他自己有電子記事本,他秘書依據他與外商談判材料按照超文本結構形式組織好了相關材料供總經理使用。下面借助于下列圖來說明。21第21頁超文本系統節點和網絡結構某人電子記事本:22第22頁第8章超文本和超媒體

8.1超文本和超媒體概念8.2超文本和超媒體系統8.3超文本和超媒體應用8.4存在問題及發展前景23第23頁超文本和超媒體系統組成要素特征和組成導航技術結構模型24第24頁超文本與超媒體組成要素

節點鏈網絡

25第25頁1.節點節點是表示信息單位,是圍繞一個特殊主題組織起來數據集合。節點內容能夠很豐富。26第26頁表現型:統計各種媒體信息如:文本節點、圖文節點等組織型:用于組織并統計節點間聯結關系。起索引目錄作用即組織節點節點。

節點分為兩種類型:27第27頁節點基本類型歸納以下:⑴文本節點⑵圖形節點⑶圖像節點⑷音頻節點⑸視頻節點⑹混合媒體節點⑺按鈕節點⑻組織型節點⑼推理型節點表現型?組織型?28第28頁表現型節點(一)文本節點:普通在字、詞上建鍵,也就是說鏈源普通為文本上字詞,稱為“熱字”。圖形節點:普通在位圖圖像上建鏈,鏈源是圖像上某一敏感區域,稱為“熱區”,經過觸發燒區,造成向另一個節點遷移。29第29頁表現型節點(二)聲音節點:是由聽覺媒體組成節點,有時稱為音樂節點。它能夠是一段錄音或者是一段合成聲音,同圖形一樣,它們也能夠嵌套在文本里。含有交互控制、播放控制、熱點設置詳細表現:從一段聲音調到另一段聲音時基類媒體30第30頁表現型節點(三)視頻節點:動畫和視頻都屬于動態圖像媒體,其特征就是時間連續性,信息是視頻信息。節點鏈源就要與時間相關—了解滯后性節點必須有交互控制能力詳細表現:從一段視頻調到另一段視頻31第31頁表現型節點(四)混合媒體節點:上述介紹節點都是由單個媒體組成節點,混合媒體節點是以上節點某種組合。按鈕節點:也稱為動作與操作節點,因為動作和操作也是一類媒體。賦之以人某種操作或動作。

←下一頁按鈕32第32頁

在面向對象超媒體系統中,慣用到組織型節點和推理型節點。

組織型節點:是用來組織其它節點節點包含索引文本節點、索引節點數據庫管理推理型節點:是用于輔助鏈推理與計算包含對象節點、規則節點上面6種節點類型只表示信息而不表示知識.33第33頁熱標(Hotspot)

確定信息關聯鏈源。確定信息之間關聯,引發向相關節點轉移不一樣媒體有不一樣熱標熱字(hot-word)熱區(hot-area)熱元(hot-element)熱點(hot-point):主要用于時基類媒體熱屬性(hot-attribution):把關系數據庫中屬性作為熱源使用34第34頁超文本與超媒體組成要素

節點鏈網絡

35第35頁2.鏈超媒體鏈又稱為超鏈,是節點間信息聯絡,它以某種形式將一個節點與其它節點連接起來。

信息間聯絡豐富多彩引發鏈種類復雜多樣,但最終到達效果卻是一致,即建立起節點之間聯絡。

36第36頁鏈普通結構鏈普通結構可分為三個部分:鏈源、鏈宿及鏈屬性。鏈源是造成瀏覽過程中節點遷移原因,能夠是熱標、媒體對象或節點等。鏈宿是鏈目標所在,能夠是節點,也能夠是其它任何媒體內容。鏈屬性決定鏈基本類型。37第37頁帶熱字文本38第38頁3.網絡超文本由節點和鏈組成網絡是一個有向圖,這種有向圖與人工智能中語義網有類似之處。39第39頁網絡含有以下特征功效:①超媒體數據庫是由聲、文、圖各類節點組成網絡。②屏幕中窗口和數據庫中節點是一一對應40第40頁③支持標準窗口操作,窗口能被重定位、調整大小,關閉或縮小成一個圖符。④窗口中可含有許多鏈標示符,它們表示鏈接到數據庫中其它節點鏈。⑤作者能夠很輕易地創建節點和鏈接新節點鏈。⑥用戶對數據庫進行瀏覽和查詢。

41第41頁宏節點

宏節點是指鏈接在一起節點群,更準確地說,一個宏節點就是超文本網絡一個有某種共同特征子集。當超媒體信息網絡十分巨大時,分層是簡化網絡拓撲結構最有效方法。

42第42頁一臺計算機Web網跨越計算機鏈多個宏節點多個節點宏節點=跨越網絡超鏈43第43頁超媒體系統特征和組成

超媒體系統特征超媒體系統組成44第44頁超媒體系統特征

一個好超媒體系統應含有以下幾個主要特征:1.節點多媒體化2.網狀信息鏈接結構3.導航工具和導航能力4.窗口化管理功效5.共享數據庫等

45第45頁1.節點多媒體化含有提供文本、圖形、圖像、聲音、動畫和視頻片段等各種媒體能力,并能用多窗口形式加以表現。2.網狀信息鏈接結構含有網狀復雜信息鏈接結構,用戶能夠用不一樣方法查詢、使用超媒體中各節點內容。3.導航工具和導航能力含有良好導航工具和導航能力,能指導用戶在超媒體信息網中漫游。含有預防迷路伎倆,使用戶能夠經過定位圖確定自己位置。

46第46頁

4.窗口化管理功效含有窗口化管理功效,包含修改、增加、刪除節點和鏈能力。對節點內容有良好編輯功效。5.共享數據庫等可經過網絡共享數據庫,并能夠供多用戶使用庫內信息;含有交互式操作和程序員接口。47第47頁超媒體系統組成

超媒體系統普通由

創作子系統

讀者子系統

支持子系統組成48第48頁創作子系統:完成多媒體時空表現描述,建立超媒體信息網絡節點和鏈,并對已經有超媒體系統進行增加、刪除和修改等操作。

讀者子系統:用于幫助用戶使用超媒體文件和數據。超媒體系統組成49第49頁它要幫助創作子系統和讀者子系統完成對超媒體節點、鏈、熱標、宏節點管理和維護。它能識別超鏈成份,并引導轉向對應目標節點。它要完成多媒體信息存放、輸入和輸出、數據庫管理等工作假如在網上運行,則支持子系統要幫助用戶完成不一樣計算機之間協議連接和通信,完成用戶各種操作。

支持子系統:系統應用內核層--實現超媒體服務關鍵,超媒體系統組成50第50頁超媒體系統導航技術

超媒體系統信息量大,結構靈活,若沒有良好導航工具,查找信息如大海撈針。經過導航工具,用戶能方便地找到所需要信息,并在迷路時能返回原地。

51第51頁現有導航工具主要有以下幾個:1.直接組織器2.映像圖和圖形組織器3.聯機指南或幫助4.傳統索引52第52頁

1.直接組織器設計者建立直觀圖形、圖像和界面,幫助用戶存取能夠看到和能夠聽到數據庫。2.映像圖和圖形組織器圖形組織界面給出數據庫里鏈概圖,顯示“內容”在數據庫內位置;組織映像圖給用戶提供瀏覽路徑。導航工具53第53頁3.聯機指南或幫助

統計用戶個人瀏覽路徑,顯示系統中鏈并連成網,由此可看出用戶興趣所在。4.傳統索引傳統索引表或其它文本查詢工具也能夠作為導航工具,滿足用戶習慣。

54第54頁超文本與超媒體系統結構模型

超文本與超媒體系統就是完成并只使用前述超文本或超媒體軟硬件總稱。從理論上講可將其劃分為三個層次:表現層——用戶接口;超文本抽象機層——節點和鏈;數據庫層——存放、共享數據和網絡訪問。55第55頁超文本和超媒體體系結構

56第56頁數據庫層是模型中最低層,它包括全部傳統相關信息存放問題,是為基礎。1.數據庫層超文本系統中信息量大,需要存放信息量也就大57第57頁超文本抽象機層是三層模型中中間層,這一層決定了超文本系統節點和鏈基本特點,統計了節點之間鏈關系,并保留了相關節點和鏈結構信息。2.超文本抽象機層58第58頁用戶接口層也稱表示層或用戶界面層,是三層模型中最高層,也是超文本系統特殊性主要表現,并直接影響著超文本系統成功。用戶接口層是超文本和超媒體系統人-機交互界面。用戶接口層決定了信息表現方式、交互操作方式以及導航方式等。

3.用戶接口層59第59頁超文本與超媒體系統兩個模型

超文本和超媒體系統結構較著名是Cambell和Goodman模型,另一個是從事超文本標準化研究Dexter小組提出Dexter模型。

60第60頁這兩個模型是基本相同,它們都是將超文本和超媒體體系結構分為三個層次,如圖所表示。網狀關系元素內容用戶工具61第61頁第8章超文本和超媒體

8.1超文本和超媒體概念8.2超文本和超媒體系統8.3超文本和超媒體應用8.4存在問題及發展前景62第62頁超文本與超媒體應用

伴隨多媒體技術發展,超文本與超媒體技術,含有遼闊應用前景。超文本與超媒體組織和管理信息方式符合人們“聯想”思維習慣。適合于非線性數據組織形式,以它獨特表現方式,得到了廣泛應用。

63第63頁1.多媒體信息管理超媒體被許多人稱為“天然”多媒體信息管理技術。百科全書、詞典、各種專業參考書、科技期刊中。有效組織,使得用戶使用起來愈加方便64第64頁

2.個人學習、工作輔助與辦公自動化

超文本與超媒體應用于辦公自動化中,改變了人們傳統工作方式和思維習慣,提供人們更為形象、直觀工作環境,極大地提升了工作效益和效率。

65第65頁3.商業展示、產品廣告和指南超媒體化產品和廣告、單位形象介紹、展覽會展示、旅游和飯店指南、機場和車站查詢機等都為用戶提供了一個很好展示方式。66第66頁4.娛樂(音樂、小說、電影)和休閑

超媒體神化故事、偵探小說、報紙和刊物、家庭菜譜、電子游戲等,為家庭休閑和娛樂開辟了新路徑。

67第67頁“交互式小說”和“交互式電影”,用超媒體組織素材,由讀者和觀眾自己編輯,按自己興趣和愿望去改變主人翁命運和結局。68第68頁WWW中超文本和超媒體

Internet提供了世界范圍內網絡互連和通信功效。

WWW(WorldWideWeb環球信息網)是Internet中最正確信息檢索體系。它以基于客戶/服務器工作方式,經過超文本文件,把全世界不一樣地點服務器相關信息有機地結合了起來。服務器瀏覽器69第69頁WWW客戶程序成為瀏覽器

運行在客戶機上,利用超文本傳輸協議向服務器發出請求,訪問服務器上超文本和超媒體信息,并在客戶端上以多媒體形式表現出來。通信兩個協議:超文本傳輸協議(HyperTextTransferProtocol,HTTP),提供聯絡方式及信息傳送格式。超文本標識語言(HyperTextMarkupLanguage,HTML),提供表現界面與超文本鏈接標識語言。

70第70頁超文本傳輸協議HTTPHTTP協議運行在客戶程序和服務器程序中。不一樣端系統上客戶程序和服務器程序經過交換HTTP消息彼此交流。HTTP定義Web客戶(即瀏覽器)怎樣從web服務器請求Web頁面,以及服務器怎樣把Web頁面傳送給客戶。71第71頁HTTP消息請求消息示例:GET/hypertext/www/TheProject.htmlHTTP/1.0方法協議宿主名目錄與文件名協議版本客戶發出消息服務器響應消息72第72頁SGMLHTMLXML超文本標識語言

73第73頁SGML

標準通用標識語言(StandardGeneralizedMarkupLanguage,SGML)是1988年一個國際標準。SGML是一個用標識來描述文檔資料通用語言。早在Web未創造之前,SGML就早已存在。74第74頁SGML要求了在文檔中嵌入描述標識標準格式,指定了描述文檔結構標準方法。

SGML是一個包含超文本鏈接(hypertextlinks)綜合語言,在Web上使用HTML格式是使用固定標簽集一個SGML文檔。

SGML語法是能夠擴展。

75第75頁HTML

超文本標識語言(HyperTextMarkupLanguage,HTML)是一個用來創作萬維網頁面描述語言。

HTML是從SGML導出語言,是SGML一個子集。使用HTML創作文檔是一套固定標簽SGML文檔。

76第76頁2

HTML文檔結構<html>

<head>

<title>……</title>

</head>

<body>

正文內容

</body></html>告訴瀏覽器HTML文件開始和結束<html>…</html>HTML文件頭部標識<head>…</head><body>…</body>HTML文件主體標識<title>…</title>文檔名稱標識HTML文檔基本結構以下:77第77頁XML

可擴展標識語言(ExtensibleMarkupLanguage,XML)是一個新型標識語言。它同HTML一樣,都來自SGML。

XML是一個精簡SGML,它將SGML豐富功效與HTML易用性結合到Web應用中。78第78頁1

XML文檔基本結構例:一個簡單XML文檔第一行是XML申明,定義此文檔所遵照XML標準版本,在這個例子里是1.0版本標準,使用是ISO-8859-1字符集。后面幾行是文檔元素,其中,“note”是“大”元素,在“大”元素中包含若干“小”元素,如“to”、“from”等。<?xmlversion="1.0"encoding="ISO-8859-1"?><note><to>Lin</to><from>Ordm</from><heading>Reminder</heading><body>Don'tforgetmethisweekend!</body></note>79第79頁XML保留了SGML可擴展功效。XML不再是固定標識,允許定義數量不限標識來描述文檔中資料,允許嵌套信息結構。

HTML只是Web顯示數據通用方法,而XML提供了一個直接處理Web數據通用方法。

HTML著重描述Web頁面顯示格式,而XML著重描述是Web頁面內容。

XML與HTML區分80第80頁

XML應用可分為四類:用于客戶需要與不一樣數據源進行交互時。應用于將大量運算負荷分布在客戶端,即客戶可依據自己需求選擇和制作不一樣應用程序以處理數據,而服務器只須發出同一個XML文件。應用于將同一數據以不一樣面貌展現給不一樣用戶。這一應用也可在上例中表達出來。應用于網絡代理對所取得信息進行編輯、增減以適應個人用戶需要。81第81頁虛擬現實在Internet上應用有:遠程教育商業應用娛樂82第82頁第8章超文本和超媒體

8.1超文本和超媒體概念8.2超文本和超媒體系統8.3超文本和超媒體應用8.4存在問題及發展前景83第83頁超文本與超媒體存在問題超文本與超媒體是一項正在發展中技術,即使它有許多獨特優點,但也存在許多不夠完善方面。

84第84頁1.信息組織超文本信息是以節點作為單位。怎樣把一個復雜信息系統劃分成信息塊是一個較困難問題。比如一篇文章,一個主題,又可能分成幾個觀點,而不一樣主題觀點又相互聯絡,而為這些聯絡分割開來,就會破壞文章本身表示思想。這么節點組織和安排就可能要重復調整和組織。

85第85頁2.智能化即使大多數超文本系統提供了許多幫助用戶閱讀輔助信息和直觀表示。但因超文本系統控制權完全交給了用戶,當用戶接觸一個不熟悉題目時,可能會在網絡中迷失方向。要徹底處理這一問題,還需要研究更有效方法,這實際上是要超文本系統含有某種智能性,而不是只能被動地沿鏈跳轉。超文本在結構上是人工智能有著相同之處,使它們有機結合將成為超文本與超媒體系統必定趨勢。

86第86頁3.數據轉換超文本系統數據組織與現有各種數據庫文件系統格式完全不一樣。引入超文本系統后,怎樣為傳統數據庫數據轉換到超文本中也是一個問題。

87第87頁4.兼容性當前超文本系統大都是依據用戶要求分別設計,它們之間沒有考慮到兼容性問題,也沒有統一標準可循。所以要盡快制訂標準并加強對版本控制。標準化是超文本系統一個主要問題,沒有標準化,各個超文本系統之間就無法溝通,信息就不能共享。

88第88頁5.擴充性現有超文本系統,有待于提升檢索和查詢速度,增強信息管理結構和組織靈活性,方便提供方便系統擴充伎倆。

89第89頁

6.媒體間協調性

超文本向超媒體發展也帶來了一系列需要深入研究問題,如多媒體數據怎樣組織,各種媒體間怎樣協調,節點和鏈怎樣表示;對音頻和視頻這一類與時間有親密關系媒體引入到超文本中,對系統體系結構將產生什么樣影響,當各種媒體數據作為節點和鏈內容時,媒體信息時間和空間劃分,內容之間合理組織都是在多媒體數據模型建立時要認真處理問題。

90第90頁超文本與超媒體發展前景

由超文本向超媒體發展由超媒體向智能超媒體發展由超媒體向協作超媒體發展

91第91頁1.由超文本向超媒體發展從超文本到超媒體是技術發展進步,也是技術發展必定性。超文本向超媒體轉變不但是將文本媒體擴展到其它媒體,而且還要能使系統自動地判斷媒體類型,并執行對應操作。對圖像熱區,視頻熱點等都能引發類似于熱字反應,多媒體表現及基本內容檢索等。超文本向超媒體轉變,大大地增強了功效和性能,也增加了系統實現難度。

92第92頁2.由超媒體向智能超媒體發展在超媒體技術研究中,有些人提出智能超媒體或教授超媒體(Expertext)。這種超媒體打破了常規超媒體文件內部和它們之間嚴格鏈限制,在超媒體鏈和節點中嵌入知識或規則,允許鏈進行計算和推理,使得多媒體信息表現含有智能化。

93第93頁3.由超媒體向協作超媒體發展超媒體建立了信息之間鏈接關系,那么也可用超媒體技術建立人與人之間鏈接關系,這就是協作超媒體技術。超媒體節點與鏈概念使之成為支持協同性工作自然工具。協同工作使得多個用戶能夠同一組超媒體數據上共同進行操作。這么未來電子郵政、公共提醒板等都可能應用到超媒體系統中。94第94頁附:html與xml95第95頁1

HTML概述超文本標識語言(HyperTextMakeupLanguage,HTML)是一個文本類、解釋執行、用來制作超文本文件簡單標識語言。一個HTML文擋通常由文檔頭、文檔名稱、表格、段落和列表等文檔元素組成,而且使用HTML要求標識來標識這些元素。

HTML專長是將文件數據顯示在瀏覽器中,它提供了很多與顯示內容相關標識,這些標識都是系統定義,用戶無法自定義所要標識。就普通使用,HTML所提供標識還是夠用,而且當前市面上很多網頁制作軟件,均支持HTML文件格式。96第96頁2

HTML文檔結構<html>

<head>

<title>……</title>

</head>

<body>

正文內容

</body></html>告訴瀏覽器HTML文件開始和結束<html>…</html>HTML文件頭部標識<head>…</head><body>…</body>HTML文件主體標識<title>…</title>文檔名稱標識HTML文檔基本結構以下:97第97頁3

鏈接標識連接是指將文檔中文本或者圖像與另一個文檔、文檔一部分或者另一幅圖像等內容鏈接在一起。在HTML中,鏈接基本格式是:<ahref=”URL地址“>鏈接名</a>屬性href是不可缺乏,其值能夠是URL形式或mailto形式。比如:<ahref="">歡迎光臨清毅盲人網</a>

超鏈接三種類型:內部鏈接:指向文檔內部鏈接外部鏈接:指向非當地服務器上文檔鏈接當地鏈接:指向當地服務器或計算機漢字檔鏈接98第98頁4

多媒體標識插入圖像(1)內聯圖象內聯圖像是指與Web網頁中文本一起下載和顯示圖像,表現為文本和圖像顯示在同一網頁上,在HTML文檔中插入圖像文件格式以下:<imgsrc="URL地址"align=""border=""width=""height=""alt="">…</img>例199第99頁<html><head><title>插入內聯圖像</title></head><h1>內聯圖像</h1><body><imgsrc="7-1.jpg"align=leftborder=5width=250height=200></body></html>例1:內聯圖像運行結果100第100頁4

多媒體標識插入圖像(2)外聯圖像當內聯圖像很大時,瀏覽網頁時就需要花很長時間來下載圖片。處理這個問題方法是用文字或小內聯圖像來代表大圖像,而把大圖像看成一個單獨文檔,再把文字或者圖標與大圖像鏈接在一起,當用鼠標單擊這個鏈接后,大圖像顯示在另一個窗口中,這種圖像就稱為外聯圖像鏈接外聯圖像能夠使用下面語句:<ahref="URL地址">…</a>例2101第101頁<html><head> <title>插入外聯圖象</title></head><h1>外聯圖象</h1><body> <ahref="mooncake.jpg"><imgsrc="Smallfile.jpg"></a> <br> <br> <ahref="mooncake.jpg">用文字代表大圖像</a> </body></html>例2:外聯圖像運行結果102第102頁4

多媒體標識插入圖像(3)圖像作為網頁背景例3使用圖像作為網頁背景可使用下面語句:<bodybackground="URL地址">background屬性指定圖像文件,其值為背景圖像URL地址。瀏覽器將其平鋪,充滿整個網頁。103第103頁<html><head><title>圖像作為網頁背景</title></head><bodybackground="background.jpg"></body></html>例3:圖像作為網頁背景運行結果104第104頁4

多媒體標識插入聲音或視頻(1)在文檔中鏈接聲音或視頻文件<html><head><title>插入聲音和視頻</title></head><body><ahref="sound.mp3">聲音文件</a><br><br><ahref="video.mpg">視頻文件</a></body></html>例4:插入聲音和視頻文件在HTML文檔中,使用與外聯圖像類似語句把聲音文件或視頻文件鏈接到文檔中,差異只是文件擴展名不一樣。運行結果105第105頁

4

多媒體標識插入聲音或視頻(2)在文檔中嵌入聲音或視頻文件把聲音或視頻文件嵌入到HTML文檔中,能夠使用下面代碼:上面代碼在頁面中插入一個MediaPlayer(視頻)播放器來播放音、視頻,參數值默認0為否,-1或1為是。<objectclassid="clsid:22D8F312-B0F8-11D0-94AB-0080C74C7E95"id="MediaPlayer1"height=80width=320><paramname="Filename"value="MTV視頻文件URL地址"><paramname="PlayCount"value="0"><paramname="AutoStart"value="1"><paramname="EnableFullScreenControls"value="1"><paramname="ShowAudioControls"value="1"><paramname="EnableContextMenu"value="1"><paramname="ShowDisplay"value="0"></object>例5106第106頁<html><head> <title>嵌入視頻</title></head><body> <objectclassid="clsid:22D8F312-B0F8-11D0-94AB-0080C74C7E95"id="MediaPlayer1"height=280width=320><paramname="Filename"value="video.mpg"> <paramname="PlayCount"value="0"> <paramname="AutoStart"value="0"> <paramname="EnableFullScreenControls"value="1"> <paramname="ShowAudioControls"value="1"> <paramname="EnableContextMenu"value="1"> <paramname="ShowDisplay"value="0"></object><br><br>視頻文件</body></html>例5:嵌入視頻文件運行結果107第107頁

4

多媒體標識插入聲音或視頻(3)在文檔中嵌入背景音樂在頁面中還能夠嵌入背景音樂,這種音樂多以MIDI文件為主。嵌入背景音樂基本語法以下:

<bgsoundsrc="URL地址"loop=""volume="">例6108第108頁<html><head><title>在文檔中嵌入背景音樂</title></head><h1align=center>嵌入了背景音樂文檔</h1><body><bgsoundsrc="GreenSleeves.MID"></body></html>例6:在文檔中嵌入背景音樂運行結果109第109頁4

多媒體標識嵌入Flash動畫在HTML文檔中,能夠使用下面語句嵌入Flash動畫。<embedsrc="URL地址"align=""autostart=""loop=""height=""width="">…<.embed><html><head><title>嵌入Flash動畫</title></head><body><embedsrc="flash.swf"width=300height=200></height></body></html>例7:嵌入Flash動畫運行結果110第110頁5

表格標識表格主要經過3個標識來組成:表格標識、行標識、單元格標識。●<table></table>●<caption></caption>●<tr></tr>

●<th></th>●<td></td>例8表格表頭單元格每一行屬性111第111頁<html><head> <title>一個簡單表格</title></head><body> <tableborder=1> <caption>學生情況表</caption> <tr> <th>姓名</th><th>性別</th><th>年紀</th> </tr> <tr> <tdalign=left>a</td><tdalign=center>男</td><tdalign=right>20</td> </tr> <tralign=right> <td>b</td><td>女</td><td>19</td> </tr> </table></body><html>例8:一個簡單表格運行結果112第112頁6

表單標識URL指明客戶端向服務器請求文件。Method=*中“*”表示GET或POST,表單中提供給用戶輸入形式:<inputtype=*name=**>。其中“*”代表輸入元素類型,“**”代表表單元素名稱。表單是實現動態網頁一個主要外在形式,基本語法結構以下:<formaction=”URL”method=*>……<inputtype=submit><inputtype=reset></form>113第113頁7交互功效實現在記事本中輸入表單代碼,保留為first.htm第一步代碼第二步安裝IIS第三步編寫對應demo.asp文件第四步將兩個程序保留在C:\Interpub\wwwroot目錄中代碼打開瀏覽器,在地址欄中輸入/first.htm,在表單中輸入姓名,選擇性別后,單擊“確定”按鈕即可實現交互功效。114第114頁<html>

<head>

<title>表單</title>

</head>

<body>

<h2align=centerstyle="color:blue">請輸入您姓名和性別</h2>

<hr>

<formmethod=postaction="demo.asp">

<tableborder="0"align="center"><tr>

<tdalign="right">姓名:</td>

<td><inputtype="text"size="8"name="Name"></td>

</tr>

<tr>

<tdalign="right">性別:</td>

<td>

<inputtype="radio"name="sex"value="femal">女

<inputtype="radio"name="sex"value="male">男

</td>

</tr>

<tr>

<tdalign="right">

<inputtype="submit"value="確定">

</td>

<tdalign="right">

<inputtype="reset"value="重置">

</td>

</tr></table></form></body></html>

first.htm運行結果返回115第115頁

demo.asp<html><head></head><body>

您姓名為:<%=request.form("Name")%>。<br>

您性別為:<%=request.form("sex")%>。</body></html>返回116第116頁HTML一個通用文檔結構描述置口號言,要求了在文檔中嵌入描述標識標準格式,為語法置標提供了異常強大工具,含有極好擴展性。缺點是復雜度太高,且SGML軟件價格非常昂貴,不適合網絡日常應用。

SGML優點是簡單易學、靈活通用,公布、檢索、交流信息非常簡單,比較適合Web頁面開發。缺點是標識相對少,可擴展性差,缺乏SGML柔性和適應性。XML(ExtensibleMarkupLanguage)和HTML一樣,是SGML一個子集。XML是被設計用來描述數據,重點在于什么是數據,怎樣存放數據;HTML是被設計用來顯示數據,重點在于顯示數據以及怎樣更加好顯示數據。XML不是HTML替換品,XML和HTML是兩種不一樣用途語言。

XML和HTML主要區分117第117頁1

XML文檔基本結構例:一個簡單XML文檔第一行是XML申明,定義此文檔所遵照XML標準版本,在這個例子里是1.0版本標準,使用是ISO-8859-1字符集。后面幾行是文檔元素,其中,“note”是“大”元素,在“大”元素中包含若干“小”元素,如“to”、“from”等。<?xmlversion="1.0"encoding="ISO-8859-1"?><note><to>Lin</to><from>Ordm</from><heading>Reminder</heading><body>Don'tforgetmethisweekend!</body></note>118第118頁1

XML文檔基本結構例:一個簡單XML文檔<?xmlversion="1.0"encoding="ISO-8859-1"?><note><to>Lin</to><from>Ordm</from><heading>Reminder</heading><body>Don'tforgetmethisweekend!</body></note>●英文字母大小寫視為不一樣字符。●名稱能夠包含字母、數字以及其它字符。●名稱不能以數字或”_”(下劃線)開頭。●名稱不能以字母xml(或XML或Xml)開頭。●名稱不能包含空格。XML元素名稱必須遵照下面命名規則:119第119頁2

XML語法●必須有XML申明語句●XML標識都是大小寫敏感●屬性值必須使用引號""●全部標識必須有對應結束標識●全部空標識必須被關閉●全部XML元素必須合理包含●XML中空白將被保留●XML中注釋語法基本上和HTML中一樣120第120頁3

XML三要素DTD文件類型定義DTD,用來對文件格式進行定義。而使用文件類型定義,能夠設計出統一格式XML文件。●使XML文件標準化變為可行●使不一樣應用程序或用戶能夠讀取彼此文件●外部DTD能夠被不一樣文件或網站分享●設計者能夠針對DTD做各種格式美化,而不用擔心會改變XML中源數據●用不一樣DTD,能夠將XML文件轉換成不一樣文件格式●利用DTD中實體參考能夠使XML文件內容更豐富、更結構化DTD將文件結構和文件內容完全分開,使用DTD好處以下:121第121頁3

XML三要素XSLXSLXSLT:能將XML文件轉換成另一個格式文件后,另存為一個新文件,不會更改原有XML文件。XSLFO:提供大量格式指令,能夠準確設置屏幕顯示格式或打印格式。●XML→HTML●XML→XML●XSL→XSL

XSL最常見轉換:可擴展樣式語言XSL,是用于將XML數據翻譯為HTML或其它格式語言。是設計XML文檔顯示樣式主要文件類型。122第122頁3

XML三要素XSL可擴展樣式語言XSL,是用于將XML數據翻譯為HTML或其它格式語言。是設計XML文檔顯示

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網頁內容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間,僅對用戶上傳內容的表現方式做保護處理,對用戶上傳分享的文檔內容本身不做任何修改或編輯,并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容,請與我們聯系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論