計算機與信息技術基礎第九章_第1頁
計算機與信息技術基礎第九章_第2頁
計算機與信息技術基礎第九章_第3頁
計算機與信息技術基礎第九章_第4頁
計算機與信息技術基礎第九章_第5頁
已閱讀5頁，還剩40頁未讀， 繼續免費閱讀

下載本文檔

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

文檔簡介

網頁制作初步第九第九章網頁制作初步9.1HTML語言9.3Web技術9.2FrontPage2003Web網頁是一個文本文件，其中包含文本、圖形和超鏈接等元素。制作網頁的基本技術標準是超文本標記語言（HTML，HyperTextMarkupLanguage）。HTML是根據國際標準化組織（ISO）的廣義置標語言SGML（StandardGeneralizedMarkupLanguage）標準定義的，它規定了文檔的邏輯組織格式，包含了文本、圖像、動畫、表單和鏈接等多種形式。9.1HTML語言HTML（HyperTextMarkupLanguage超文本標記語言）是標準文檔格式化系統，使用HTML控制信息的文本文件被稱為HTML文件，也稱Web文件。使用普通的文本編輯器就可以創建Web文件。方法是：在文本編輯器中，輸入一段文本，再給文本加上HTML標記，然后以擴展名htm或html存盤。⒈創建簡單Web頁HTML文件由控制部分和正文部分組成。HTML的控制標記對大小寫不敏感，同時控制標記用“<>”進行區分。⑴<HTML>和</HTML>標記，把全部源代碼“括起來”，就像括號一樣。⑵<HEAD>和</HEAD>標記，把全部控制部分括起來。⑶<TITLE>和</TITLE>標記，把頁面標題括起來。⑷<BODY>和</BODY>標記，把全部正文部分括起來。HTML標記一般配對使用，只有少數標記單獨使用。例如：

⑴<P>表示一個自然段落的結束，一般加在兩個自然段落之間，此時</P>被省略。⑵<BR>表示轉行（斷行），不表示自然段落的結束。與<P>標記相比，<BR>標記因為產生的行間距較小，被廣泛使用。⑶<HR>表示畫水平線。演示例9.1超級鏈接是指多個Web頁面通過關鍵字或圖像連結起來，通過關鍵字或圖的單擊操作，可以自動切換內容的技術。帶有“鏈接”的文本文件叫做超文本。鏈接所使用的關鍵字一般為藍色下劃線的文字標志，通過<AHREF=….>和</A>標記實現。⒉超級鏈接⑴本地鏈接。本地鏈接與網絡無關，通過鏈接把本地的HTML文件鏈接起來構成信息整體。例如：包含<ahref="h1.htm">單擊此處</A>⑵異地鏈接。通過Internet的統一資源定位器（URL），鏈接遠程其它計算機上的HTML文件。例如：<AHREF="http://">新疆大學主頁</A>。演示例文字控制

有關控制文字的HTML標記是：<FONT>…</FONT>常見的屬性參數如下：SIZE=“...”規定字體的大小尺寸。COLOR=“...”規定文字的顏色。FACE="..."規定字體演示例9.3在HTML標記中，下列標記也能進行字體顯示效果的控制：<SMALL>……</SMALL>規定小字體顯示<BIG>……</BIG>規定大字體顯示<B>……</B>規定黑體字顯示<Center>…….</Center>規定文字居中對齊顯示9.1.2圖像和動畫

插入圖形或動畫的標記是：<IMGSRC="文件名">有以下屬性：SRC="..."圖象（動畫）文件的URL地址文件名。ALT="..."在圖像未完全收到時，圖像位置顯示的文字信息。ALIGN=“...”確定圖像的對齊方式。演示例整體控制頁面的整體控制屬性在<BODY>標記中，常用的以下屬性：BACKGROUND=“...”構成背景的圖片文件名。BGCOLOR=“...”背景顏色。TEXT="..."默認文本顏色。LINK="..."未被訪問的文字鏈接源的顏色。ALINK="..."被激活的文字鏈接源的顏色。VLINK="..."訪問過的文字鏈接源的顏色。BORDER=”…”圖像邊界的寬度，單位是像素點。演示例表格標記表格的標記是<TABLE>...</TABLE>屬性語法如下：⑴邊線控制：BORDER=“...”⑵寬度控制：WIDTH="..."表格的行標記是<TR>...</TR>屬性語法如下：ALIGH=“...”行中單元水平對齊方式VALIGN="..."表行中垂直對齊方式表格的列標記是<TD>...</TD>屬性語法如下：ALIGN="..."單元內容水平對齊方式VALIGN="..."單元內容垂直對齊方式ROWSPAN="..."該單元跨過的行數；COLSPAN="..."該單元跨過的列數。演示例其它控制標記HTML標記非常多，而且數量和規則一直還處于不斷發展變化的過程中，隨著可視化網頁自動制作工具的迅速普及，不常用的標記已經沒有必須記憶的必要。用戶只要知道最常用的一些標記，就可以學習XML、ASP和JavaScript等更強勁的信息控制技術。表單包含的控制標記是：<INPUT>。<INPUT>標記具有豐富的屬性參數，語法如下：TYPE=”…”表示控制部件的類型，NAME=”…”表示該控制部件的名稱。SIZE=”…”表示該控制部件的大小。Value=”…”表示該控制部件所具有的值。⑴幀標記<FRAMESET>⑵表單標記<FORM>…</FORM>小結：HTML概念認識WEB頁HTML標記簡介9.2FrontPage2003

FrontPage2003是Microsoft公司推出的Office2003系列辦公套裝軟件之一，使用方便，充分體現了“所見即所得”制作效果，操作簡單和交互能力強的特點吸引了廣大的計算機愛好者。⒈用戶界面

菜單欄視圖欄狀態欄標題欄工具欄工作區FrontPage2003提供了6種視圖方式1.網頁視圖 4.導航視圖2.文件夾視圖 5.超鏈接視圖3.報表視圖 6.任務視圖網頁視圖上，有3種頁面模式⑴普通標簽 ⑵HTML標簽 ⑶預覽標簽⒉文字符號處理

在FrontPage2003窗口的“普通”標簽頁面中，對文字信息輸入和編輯的處理方法；常用工具和格式工具的外形也基本上與Word相似。在網頁中需要重點突出的內容（大小標題等）應采用比較突出的顏色，而正文則最好采用統一的顏色。一般具有4種段落的對齊方式：左對齊、居中對齊、右對齊和兩端對齊。演示例超鏈接在FrontPage2003中，將鏈接被定義為兩部分組成：超鏈接主體和超鏈接目標地址。超鏈接主體是指引導超鏈接的部分（包含文本和圖像）。當鼠標指針移動到超鏈接的主體上時，鼠標指針將會變成一個手的形狀。超鏈接目標地址是指鼠標單擊后，將要顯示內容，即切換對象。演示例9.9書簽用來標記網頁中的信息位置，因而建立頁內超鏈接。當一個頁面文件很大或者要定位光標位置時，書簽超鏈發揮積極的作用。創建書簽超鏈接時，首先必須定義書簽，然后再把超鏈接指向書簽。演示例圖像控制

FrontPage2003對Web中插入圖像的技術，提供了比較完整的技術支持。FrontPage2003充分體現了圖文混排工具的優越性，極大地加快網頁制作的效率和提高網頁制作的質量。演示例表格處理

在Web中，表格可以有效的組織、規劃和布局頁面。但是，表格標記是屬于比較復雜的標記，手工編寫容易出錯。演示例9.16演示例動態元素

在網上瀏覽網頁時，經常可以看到有些元素在運動，為了能夠容易制作網頁的動態效果，FrontPage2000提供了多種動態效果制作技術，并把這些動態元素作為組件集中在一起，通過“插入”菜單中“組件”選項（或工具欄中的組件按鈕）可以插入動態元素。⒈橫幅廣告FrontPage2003中，可以制作幾幅圖片一幅幅地按照一定的切換效果不斷播放，還可以控制每一幅圖片顯示的時間。演示例9.17⒉懸停按鈕

懸停按鈕是一個動感按鈕，如果把鼠標移到該按鈕上，就會它會改變顏色和亮度，如果單擊該按鈕時，就會鏈接到另一個頁面。缺省情況下，懸停按鈕是一個彩色方框的文字按鈕。演示例9.18⒊字幕可以滾動的文字一般稱為字幕。在很多網頁中都可以看到滾動字幕，特別醒目，經常用來發布一些站點的通知或提示信息等。滾動字幕在網頁中的效果是：包含一些文字或小圖片的一個方框沿著一個方向滾動或來回滾動。演示例9.19⒋站點計數器

站點計數器的主要功能是顯示被訪問的次數。瀏覽者訪問網頁時，站點計數器中的數字就會增加，就可以實現訪問統計的目的。只有將包含計數器的網頁從Web服務器進行發布后，站點計數器才能正常工作。演示例9.20⒌DHTML

DHTML是表示動態元素的HTML技術。使用DHTML技術可以把所選定的網頁元素設置為動態效果。演示例9.21⒍過渡效果

網頁過渡效果是指當瀏覽者進入或離開網頁時所產生的效果。9.2.5框架技術

框架技術是HTML語言提供的另一種進行頁面布局的技術，用戶可以將頁面分成若干個子窗格，總體上有一個總控HTML文件將各個窗格聯系起來，同時每個窗格里單獨放置一個HTML文件。小結：認識FrontPage2003界面用FrontPage2003建立WEB頁超鏈接功能圖像控制功能表格處理功能使用動態元素使用框架9.3Web技術Web的面貌已經發生了非常重要的變化，以訪問DBMS和在線商務活動等功能為代表的動態Web應用程序成為計算機發展的熱門技術之一。動態Web技術也是基于客戶機/服務器結構的，在總體上可分為客戶端擴展技術和服務器端擴展技術兩大類，以客戶機/服務器應用模式為基礎在客戶端擴展的技術主要是JavaScript、VBScript、Perl、Applets、ActiveX、XML、CSS和Flash等。服務器端擴展的技術主要是CGI、ISAPI、NSAPI、SSI、ASP、PHP、JSP和Net等。客戶端擴展技術是指瀏覽器中集成或增加的支持數據變動的新技術，提高了Web頁面的實用化程度。客戶端擴展技術可以驗證交互數據的合法性，進行數據計算、分類和統計等功能，甚至可以在Web頁面內制作游戲程序。⒈客戶端擴展技術

演示示例為了讓Web“動”起來，HTML本身的標記規則也在進一步擴展和改進，CSS（疊層式表單語言）以精良的界面裝飾技術占據了不可替代的技術角色，它支持三維立體的超文本組織方式，允許設計者自己定義Web頁面的樣式，具有更好的易用性和擴展性。XML（擴展式標記語言）是HTML語言的改良版，支持用戶自定義的控制標記，可以有效地降低閱讀的復雜性。⒉標記擴展⒊服務器端擴展技術瀏覽器擴展技術和服務器擴展技術總是聯合使用,動態Web技術的發展主流是服務器擴展技術。動態Web頁面最好是服務器和瀏覽器共同協作，才能達到較好的網絡應用效果。CGI（CommonGatewayInterface，通用公共網關接口）是最先發展起來的動態Web技術、是一種接口規范，定義了交互操作中雙方必須遵守的規則集。⒋ASP（ActiveXServerPages）

ASP是微軟公司面向大眾化的動態Web技術方案，建立了一整套動態Web服務器環境，可使ASP指令標記與ActiveX控件程序結合使用，建立高效的動態Web應用程序。ASP指令標記（腳本）使用特殊符號（<%%>）加以標注，例如：<%=Now（）%>。含有ASP腳本的Web頁面以asp為后綴名，全部ASP腳本都在Web服務器端執行，Web服務器僅將執行的結果發送到瀏覽器端。⒌PHP（HypertextPreprocessor）PHP也是一種服務器端嵌入式腳本標記語言，其工作原理與AS

溫馨提示

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

評論

0/150

提交評論