計算機應(yīng)用基礎(chǔ)(Windows7+Office2010)第六章 網(wǎng)頁設(shè)計基礎(chǔ)_第1頁
計算機應(yīng)用基礎(chǔ)(Windows7+Office2010)第六章 網(wǎng)頁設(shè)計基礎(chǔ)_第2頁
計算機應(yīng)用基礎(chǔ)(Windows7+Office2010)第六章 網(wǎng)頁設(shè)計基礎(chǔ)_第3頁
計算機應(yīng)用基礎(chǔ)(Windows7+Office2010)第六章 網(wǎng)頁設(shè)計基礎(chǔ)_第4頁
計算機應(yīng)用基礎(chǔ)(Windows7+Office2010)第六章 網(wǎng)頁設(shè)計基礎(chǔ)_第5頁
已閱讀5頁，還剩23頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進行舉報或認領(lǐng)

文檔簡介

第六章網(wǎng)頁設(shè)計基礎(chǔ)計算機應(yīng)用基礎(chǔ)6.1網(wǎng)頁制作基礎(chǔ)知識6.1網(wǎng)頁制作基礎(chǔ)知識6.2HTML簡介6.3AdobeDreamweaverCS4基礎(chǔ)6.1網(wǎng)頁制作基礎(chǔ)知識6.1.1基本概念1、WWW WWW，即WorldWideWeb，中文譯作萬維網(wǎng)，是為解決網(wǎng)絡(luò)中的信息傳遞問題而建立的，在WWW誕生之前，網(wǎng)絡(luò)中的信息傳遞大多采用E-mail、FTP、Archie和Gopher來實現(xiàn)，這些傳遞方式采用的協(xié)議大多無法兼容，難以實現(xiàn)互聯(lián)網(wǎng)中信息的有效檢索。由于這些限制，開發(fā)一種能夠獨立于各種平臺并方便用戶獲取信息的技術(shù)手段，已經(jīng)成為互聯(lián)網(wǎng)發(fā)展過程中的迫切需要。 1984年，歐洲量子物理實驗室（CERN）為了使分散在歐洲各國的物理學家能夠通過網(wǎng)絡(luò)合作，分享各自實驗室的研究成果，委托蒂姆·伯納斯·李利用超文本技術(shù)開發(fā)了一個網(wǎng)絡(luò)應(yīng)用軟件，這就是瀏覽器的雛形。在此基礎(chǔ)上，又開發(fā)出了超文本標記語言（HTML）和超文本傳輸協(xié)議（HTTP），用戶可以遠程利用瀏覽器軟件進入服務(wù)器進行信息查詢等操作，這標志著萬維網(wǎng)的誕生。隨后，萬維網(wǎng)聯(lián)盟（W3C）成立，WWW迅速在世界范圍內(nèi)開始推廣，現(xiàn)已成為互聯(lián)網(wǎng)中最重要的應(yīng)用之一。2、網(wǎng)頁與網(wǎng)站 所謂網(wǎng)站，是指在互聯(lián)網(wǎng)中提供多種服務(wù)的信息平臺，由域名和站點空間構(gòu)成。網(wǎng)站可以提供網(wǎng)頁服務(wù)、數(shù)據(jù)傳輸服務(wù)、郵件服務(wù)和數(shù)據(jù)庫服務(wù)等多種服務(wù)內(nèi)容，其中網(wǎng)頁服務(wù)是指根據(jù)一定的規(guī)則，在互聯(lián)網(wǎng)上進行特定內(nèi)容展示的網(wǎng)頁集合。 網(wǎng)頁通常由文本、圖像、音視頻文件、腳本程序等元素構(gòu)成，網(wǎng)頁需要通過瀏覽器進行閱讀，通常使用超文本標記語言（HTML）作為網(wǎng)頁的標準代碼。HTML可以創(chuàng)建包含圖像、聲音、動畫的格式化文本，即網(wǎng)頁文件。在HTML的基礎(chǔ)上，還誕生了一種衍生語言XML（可擴展標記語言），可以實現(xiàn)自定義標記，具有良好的擴展性，已成為新一代的網(wǎng)頁標準規(guī)范。3、域名 互聯(lián)網(wǎng)中的計算機采用的身份標識是IP地址，但由于IP地址完全由數(shù)字構(gòu)成，不便于記憶，為了解決這個問題，人們按照一定的規(guī)則對互聯(lián)網(wǎng)中的計算機定義了字符形式的地址標記，這就是域名。在網(wǎng)絡(luò)中，域名通常與IP地址是一一對應(yīng)的。按照互聯(lián)網(wǎng)中的組織模式，域名系統(tǒng)最早提出了六大分類，即.com（商業(yè)組織）、.edu（教育機構(gòu)）、.gov（政府部門）、.mil（軍事機構(gòu)）、.net（網(wǎng)絡(luò)相關(guān)組織）、.org（非營利性組織），并沒有考慮到跨國家的范圍。隨著互聯(lián)網(wǎng)在國際范圍內(nèi)的進一步發(fā)展，后期增設(shè)了以國家或地區(qū)為界限的域名系統(tǒng)，如.cn（中國）、.jp（日本）、.uk（英國）、.hk（香港）等等。6.1.2靜態(tài)網(wǎng)頁與動態(tài)網(wǎng)頁1、靜態(tài)網(wǎng)頁 靜態(tài)網(wǎng)頁并不是指網(wǎng)頁中的元素靜止，而是指純粹的HTML格式的網(wǎng)頁，它相對于動態(tài)網(wǎng)頁而言，不包含后臺數(shù)據(jù)庫，不含程序，不可交互。網(wǎng)頁的制作人員制作的頁面就是用戶最終瀏覽的頁面，不會發(fā)生任何改動。靜態(tài)網(wǎng)頁較難進行更新，一般適用于展示型內(nèi)容。靜態(tài)網(wǎng)頁執(zhí)行過程2、動態(tài)網(wǎng)頁 與靜態(tài)網(wǎng)頁一樣，動態(tài)網(wǎng)頁同樣與動畫、字幕等視覺上的運動效果沒有關(guān)系。動態(tài)網(wǎng)頁可以是純文字的頁面，也可以包含動畫等運動效果，這都是內(nèi)容的表現(xiàn)形式，無論頁面的內(nèi)容是否具有運動效果，只有采用了動態(tài)網(wǎng)頁技術(shù)生成的頁面才被稱為動態(tài)網(wǎng)頁。 從瀏覽者的角度來看，動態(tài)頁面與靜態(tài)頁面在瀏覽器中展示出的各種信息并沒有太大不同，但從工作原理來看，兩者存在著本質(zhì)的差別。靜態(tài)網(wǎng)頁僅由HTML語言構(gòu)成，而動態(tài)網(wǎng)頁采用動態(tài)網(wǎng)頁語言進行編寫，如ASP、JSP、PHP等。動態(tài)網(wǎng)頁支持數(shù)據(jù)庫技術(shù)并可以實現(xiàn)瀏覽器端與服務(wù)器端的交互功能，能夠為用戶提供種類更多、功能更強的服務(wù)。動態(tài)網(wǎng)頁執(zhí)行過程6.1.3網(wǎng)站運行方式1、實體主機 由網(wǎng)站的所有者自行購買主機，建立獨立的WWW服務(wù)器，并自行維護的方式。2、主機托管 網(wǎng)站所有者自行購買服務(wù)器主機，并將其放置在互聯(lián)網(wǎng)服務(wù)供應(yīng)商（ISP）所設(shè)立的機房，每月支付必要費用，由ISP代為管理維護，而客戶從遠端連線服務(wù)器進行操作的服務(wù)方式。

3、虛擬主機 虛擬主機是使用特殊的軟硬件技術(shù)，把真實的物理服務(wù)器主機分割成多個的邏輯存儲單元，即虛擬主機，虛擬主機沒有物理實體，但是都能像真實的物理主機一樣在網(wǎng)絡(luò)上工作，具有單獨的域名、IP地址(或共享的IP地址)以及完整的Internet服務(wù)器功能，網(wǎng)站所有者只需要租用這樣一個虛擬單元就可以實現(xiàn)站點發(fā)布。在這三類方法中，這種方式成本最低、開銷最小，廣泛被個人用戶所采用。6.2HTML簡介 HTML（HyperTextMark-upLanguage，超文本標記語言）是目前網(wǎng)絡(luò)中應(yīng)用最廣泛的語言，也是構(gòu)成網(wǎng)頁文檔的主要語言。它與常見的編程語言不同，是一種描述性的標記語言，用于描述超文本中內(nèi)容的顯示方式。HTML在文本文件的基礎(chǔ)上，增加了一系列標記，用來描述顏色、字體、字號等信息，同時可以將聲音、圖像、動畫插入頁面中形成豐富多彩的網(wǎng)頁文件，這也是它得到廣泛普及的重要原因。6.2.1HTML基本語法 HTML語法的基本形式為：<標記>內(nèi)容</標記>。其中的標記通常成對出現(xiàn)，有開始標記就有結(jié)束標記，結(jié)束標記的形式是開始標記加上斜杠“/”，一般來說，結(jié)束標記與開始標記配合使用，但在某些情況下也可以省略。6.2.2使用HTML創(chuàng)建簡單網(wǎng)頁 平時我們所見到的大多數(shù)網(wǎng)頁文件都是利用HTML生成的，所以網(wǎng)頁文件又被稱為HTML文件。從本質(zhì)上來看，HTML文件仍然是文本文件，只是擴展名變成了“.htm”或“.html”，所以使用任何的文本編輯工具都可以創(chuàng)建、修改HTML文件。在這里我們以最基本的文本編輯軟件——記事本為例，來創(chuàng)建第一個網(wǎng)頁文件。6.2.3HTML文件結(jié)構(gòu)1、<html>標記2、<head>標記3、<title>標記4、<body>標記6.2.4HTML網(wǎng)頁實例例6.1設(shè)置背景色、體會標題樣式的使用<html> <head> <title>例1.1設(shè)置背景色、體會標題樣式的使用</title> </head> <bodybgcolor=red>

以下為標題樣式：

<h1>標題一</h1> <h2>標題二</h2> <h3>標題三</h3> <h4>標題四</h4> <h5>標題五</h5> <h6>標題六</h6> </body></html>例6.2設(shè)置文字顏色<html> <head> <title>例1.2設(shè)置文字顏色</title> </head> <body> <fontcolor=purple>

紫色文字

</font> </body></html>例6.3設(shè)置加粗、傾斜，設(shè)置背景圖<html> <head> <title>例1.3設(shè)置加粗、傾斜，設(shè)置背景圖</title> </head> <bodybackground=bg.jpg> <fontcolor=blue> <b> <i>

此處文字為藍色粗斜體

</i> </b> </font> </body></html>例6.4插入圖片<html> <head> <title>例1.4插入圖片</title> </head> <body> <imgsrc=pic.jpg>

在網(wǎng)頁中插入圖片，讓網(wǎng)頁豐富多彩！

</body></html>6.2.5查看網(wǎng)頁源文件 大多數(shù)瀏覽器都提供直接查看HTML代碼的方法，這里以IE瀏覽器為例，選擇菜單欄中的“查看”菜單項下的“源文件”命令即可看到該網(wǎng)頁的源文件。6.3AdobeDreamweaver基礎(chǔ)

Dreamweaver是美國Adobe公司開發(fā)的集網(wǎng)頁制作和站點管理于一身的所見即所得網(wǎng)頁編輯器，它是針對專業(yè)網(wǎng)頁設(shè)計師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具，利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的符合規(guī)范的網(wǎng)頁。6.3.1認識DreamweaverCS4工作界面中各部分的功能如下所述：1、文檔工作區(qū) 是工作界面的主要區(qū)域，在窗口中部，它是進行網(wǎng)頁編輯創(chuàng)作的主要區(qū)域，編排的結(jié)果與網(wǎng)頁在瀏覽器中的效果近似，但仍有部分差異，這就是可視化設(shè)計工具的重要特性“所見即所得”。2、“插入”工具欄 位于界面上方，主要作用在于插入各種對象，單擊標簽可以切換不同類型的插入對象，默認為“常用”欄，包括超級鏈接、圖像、表格等。3、屬性欄 當選中某對象時，屬性欄會實時顯示相關(guān)信息和參數(shù)，并可以對其進行修改設(shè)置，其中的內(nèi)容會隨著選擇對象的不同而變化。4、面板組 針對其他不同的控制對象，還有諸如CSS樣式、行為、框架等面板，它們都在面板組中集中顯示，根據(jù)所面向的對象的不同發(fā)揮著特殊作用。6.3.2使用Dreamweaver創(chuàng)建簡單網(wǎng)頁1、添加文本2、插入圖片3、創(chuàng)建超鏈接6.3.3創(chuàng)建站點1、定義站點2、添加文件和文件夾6.

溫馨提示

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

評論

0/150

提交評論