《網(wǎng)頁設(shè)計與制作》教學(xué)87943_第1頁
《網(wǎng)頁設(shè)計與制作》教學(xué)87943_第2頁
《網(wǎng)頁設(shè)計與制作》教學(xué)87943_第3頁
《網(wǎng)頁設(shè)計與制作》教學(xué)87943_第4頁
《網(wǎng)頁設(shè)計與制作》教學(xué)87943_第5頁
已閱讀5頁，還剩26頁未讀， 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

第1章網(wǎng)頁設(shè)計與制作根底1.1學(xué)習(xí)任務(wù)：網(wǎng)頁和網(wǎng)站根本知識1.2學(xué)習(xí)任務(wù)：網(wǎng)站開發(fā)的根本流程1.5學(xué)習(xí)任務(wù)：HTML標識語言根底1.3學(xué)習(xí)任務(wù)：全面認識DreamweaverCS41.4學(xué)習(xí)任務(wù)：創(chuàng)立和管理本地站點1.6應(yīng)用實例——制作一個簡單的網(wǎng)頁1.7實訓(xùn)整理ppt1.1學(xué)習(xí)任務(wù)：網(wǎng)頁和網(wǎng)站根本知識1.1.1網(wǎng)頁和網(wǎng)站概述1.1.2網(wǎng)頁的主要元素1.1.3網(wǎng)頁類型1.1.4靜態(tài)網(wǎng)頁編輯軟件1.1.5網(wǎng)頁圖像與網(wǎng)頁動畫制作軟件整理ppt1.什么是網(wǎng)頁？瀏覽Web時所看到的文件稱為Web頁，又稱為網(wǎng)頁。網(wǎng)頁可以將不同類型的多媒體信息〔包括文字、圖像、動畫、聲音、視頻等〕組合在一個文檔中。由于這些文檔是用超文本標記語言表示的，其文件名一般是以.html或.htm結(jié)尾，因此又稱為HTML文檔或超文本。整理ppt2.什么是主頁？當我們?yōu)g覽網(wǎng)站時看到的第一個頁面。它是整個站點的入口和門面，通常這樣命名：index.html。整理ppt3.什么是超文本？

包含文字、圖像、視頻、聲音等媒體的文本，網(wǎng)頁就是一個超文本文件，并且可以實現(xiàn)鏈接操作。超文本可以給瀏覽者帶來視覺和聽覺的享受，所以Web技術(shù)又稱為超媒體技術(shù)。整理ppt注意在網(wǎng)頁上點擊鼠標右鍵，選擇“查看源文件〞，就能很清楚地看到網(wǎng)頁的代碼結(jié)構(gòu)。用戶可以使用記事本對網(wǎng)頁中的文字、圖片、表格、多媒體等頁面內(nèi)容進行編輯，并通過標記語言HTML對這些元素進行描述和控制，最后由瀏覽器對這些標記進行解釋并生成最終呈現(xiàn)在用戶眼前豐富多彩的網(wǎng)頁。整理ppt4.什么是網(wǎng)站？根據(jù)提供效勞的不同，通常把提供網(wǎng)頁效勞的效勞器稱為Web效勞器，相關(guān)網(wǎng)站稱為Web站點。一個Web站點由一個或多個Web頁組成，這些Web頁相互連接在一起，存放在Web效勞器上，以供瀏覽者訪問。網(wǎng)站是提供各種信息和效勞的基地，如用戶熟悉的搜狐、新浪、雅虎等。網(wǎng)站是由很多網(wǎng)頁鏈接在一起組成的。用戶瀏覽到一個網(wǎng)站時看到的第一個頁面叫做主頁。從主頁出發(fā)，可以訪問到本網(wǎng)站的每一個頁面，也可以鏈接到其他網(wǎng)站，方便地共享網(wǎng)站資源。整理ppt注意網(wǎng)站由假設(shè)干網(wǎng)頁組合而成。實質(zhì)上就是一個文件夾，用來存放站點相關(guān)信息資源的文件夾。整理ppt5.網(wǎng)頁根本元素有哪些？都有什么作用？設(shè)計的時候要注意什么？網(wǎng)頁包括的主要元素有：文本、圖像、動畫、導(dǎo)航欄、超鏈接、表格、表單等。整理ppt文本是人類最重要的信息載體和交流工具，網(wǎng)頁的主體一般以文本為主。制作網(wǎng)頁時，可以根據(jù)需要設(shè)置文本的字體、字號、顏色、樣式等屬性，風(fēng)格獨特的網(wǎng)頁文本設(shè)置會給瀏覽者賞心悅目的感覺。

提示：在網(wǎng)頁中應(yīng)用了某種字體樣式后，如果瀏覽者的計算機中沒有安裝該種樣式的字體，字體就以計算機系統(tǒng)默認的字體顯示出來，此時就無法顯示出網(wǎng)頁的效果了。整理ppt圖像在網(wǎng)頁中可以起到提供信息、展示作品、美化網(wǎng)頁以及表達風(fēng)格等成效。圖像可以用作網(wǎng)頁的標題、網(wǎng)站Logo、網(wǎng)頁背景、鏈接按鈕、導(dǎo)航欄、網(wǎng)頁主圖等。圖像給人的視覺效果要比文字強烈得多，在網(wǎng)頁中靈活應(yīng)用圖像可以起到點綴的效果。雖然圖像在網(wǎng)頁中不可或缺，但也不能太多，因為圖像的下載速度較慢，而且網(wǎng)頁上如果放置了過多的圖片，會顯得很亂，有喧賓奪主之勢。網(wǎng)頁上的圖像文件大局部都是使用JPG和GIF格式，因為，它們除了具有壓縮比例高外，還具有跨平臺特性。整理ppt動畫是網(wǎng)頁上最活潑的元素，通常制作優(yōu)秀、創(chuàng)意出眾的動畫是吸引瀏覽者的最有效的方法。如果網(wǎng)頁中存有太多的動畫，會使瀏覽者眼花繚亂，無心細看。所以，對動畫制作的要求越來越高。在網(wǎng)頁中參加的動畫一般是GIF格式的動畫和Flash〔.swf〕動畫等。整理ppt導(dǎo)航欄是網(wǎng)站設(shè)計者在規(guī)劃網(wǎng)站結(jié)構(gòu)時必須考慮的一個問題，站點的每個網(wǎng)頁上均應(yīng)設(shè)置導(dǎo)航欄，并且應(yīng)將其放置在網(wǎng)頁中比較明顯的位置。設(shè)置導(dǎo)航欄的目的是使瀏覽者能夠順利地瀏覽網(wǎng)頁，方便地返回主頁或繼續(xù)下一頁的訪問。導(dǎo)航欄可以是文本、按鈕或圖像的樣式。整理ppt超鏈接是網(wǎng)頁中最為有用的功能之一。超鏈接是從一個網(wǎng)頁指向另一個網(wǎng)頁的鏈接，該鏈接既可以指向本地網(wǎng)站的另一個網(wǎng)頁，也可以指向世界各地的其他網(wǎng)頁。無論是文本還是圖像都可以加上超鏈接標記，當鼠標指上超鏈接對象時會變成小手形狀，單擊鼠標左鍵即可鏈接到相應(yīng)地址〔URL〕的網(wǎng)頁。超鏈接包括站內(nèi)鏈接和站外鏈接。站內(nèi)鏈接：假設(shè)網(wǎng)站規(guī)劃了多個主題版塊，需要給網(wǎng)站的首頁參加超鏈接，讓瀏覽者可以快速地轉(zhuǎn)到感興趣的頁面。在各個子頁面也要有超級鏈接，并設(shè)有能夠回到主頁的鏈接。站外鏈接：在個人網(wǎng)站上放置一些與網(wǎng)站主題有關(guān)的對外鏈接，不但可以把好的網(wǎng)站介紹給瀏覽者，而且能使瀏覽者樂意再度光臨該網(wǎng)站。(友情鏈接)整理ppt表格是網(wǎng)頁中的一種用于控制網(wǎng)頁頁面布局的有效方法。為了到達理想的視覺效果，通常不顯示表格的邊框。使用表格輔助布局，可以實現(xiàn)網(wǎng)頁橫豎清楚的風(fēng)格。表單是一種特殊的網(wǎng)頁元素，通常用于收集信息或?qū)崿F(xiàn)一些交互式的效果。表單的主要功能是接收瀏覽者在瀏覽器的輸入信息，然后將這些信息發(fā)送到效勞器端。整理ppt6.動態(tài)網(wǎng)頁和靜態(tài)網(wǎng)頁的區(qū)別在網(wǎng)站設(shè)計中，純粹HTML格式的網(wǎng)頁通常稱為“靜態(tài)網(wǎng)頁〞，它運行于客戶端，以.htm、.html、.shtml和.xml等為擴展名。靜態(tài)網(wǎng)頁的內(nèi)容僅僅是標準的HTML代碼，靜態(tài)網(wǎng)頁上也可以出現(xiàn)各種動態(tài)效果，如GIF格式的動畫、Flash動畫等，這些“動態(tài)效果〞只是視覺上的，與下面將要介紹的動態(tài)網(wǎng)頁是不同的概念。整理ppt采用了動態(tài)網(wǎng)頁技術(shù)，在效勞器端運行的網(wǎng)頁和程序?qū)儆趧討B(tài)網(wǎng)頁，它們會根據(jù)編寫的程序訪問數(shù)據(jù)庫動態(tài)地生成頁面。動態(tài)網(wǎng)頁文件的后綴一般都是.asp、.aspx、.php、.jsp。動態(tài)網(wǎng)頁的優(yōu)點是效率高、更新快、移植性強，可以根據(jù)先前所制定好的程序頁面，根據(jù)用戶的不同請求返回其相應(yīng)的數(shù)據(jù)，從而到達資源的最大利用和節(jié)省效勞器上的物理資源。整理ppt動態(tài)網(wǎng)頁和靜態(tài)網(wǎng)頁不是從視覺上區(qū)分的，比方動畫效果，網(wǎng)頁中包含可以動的元素并不意味著就是動態(tài)網(wǎng)頁，靜態(tài)網(wǎng)頁也可以有動畫。請自行閱讀課本中它們各自的特點整理ppt7.常用的網(wǎng)頁設(shè)計軟件有哪些？FrontPageDreamweaver整理ppt8.網(wǎng)頁圖像與網(wǎng)頁動畫制作軟件PhotoshopFireworks〔.gif〕Flash(.swf)整理ppt9.HTML的根本結(jié)構(gòu)<html>…</html>：告訴瀏覽器HTML文檔開始和結(jié)束的位置，其中包括head局部和body局部。HTML文檔中所有的內(nèi)容都應(yīng)該在這兩個標記之間，一個HTML文檔總是以<html>開始，以</html>結(jié)束。<head>…</head>：HTML文件的頭部標記，頭部主要提供文檔的描述信息，head局部的所有內(nèi)容都不會顯示在瀏覽器窗口中，在其中可以放置頁面的標題以及頁面的類型、使用的字符集、鏈接的其它腳本或樣式文件等內(nèi)容<body>…</body>：用來指明文檔的主體區(qū)域，網(wǎng)頁所要顯示的內(nèi)容都放在這個標記內(nèi)，其結(jié)束標記</body>指明主體區(qū)域的結(jié)束整理ppt10.如何使用HTML編寫網(wǎng)頁文件？使用記事本，代碼編好之后，保存時這樣命名：文件名.html，保存類型選擇：所有文件使用Dreamweaver新建一個html文件演示整理ppt11.標簽標簽是HTML文檔中一些有特定意義的符號，這些符號指明內(nèi)容的含義或結(jié)構(gòu)。標簽總是放在三角括號中，大多數(shù)標簽都是成對出現(xiàn)的，表示開始和結(jié)束。<b>標簽的內(nèi)容</b>標簽名稱起始標簽結(jié)束標簽整理ppt標簽可以有屬性，賦值的時候用“=〞，多個屬性中間用空格隔開屬性要寫在開始標簽里，并且標簽符號和<>中間不可以有空格，如<img>是錯誤的結(jié)束的標簽一定要加“/〞整理ppt12.body標簽常見屬性介紹bgcolor屬性：用于設(shè)置HTML網(wǎng)頁的背景顏色，例如，<bodybgcolor=#FF0000>表示背景顏色設(shè)置為紅色。background屬性：用于設(shè)置HTML網(wǎng)頁的背景圖片，例如，<bodybackground="tu.jpg">表示將圖片tu.jpg設(shè)置為HTML網(wǎng)頁的背景。整理ppttext屬性：用于設(shè)置HTML網(wǎng)頁的文本顏色。使用text定義的顏色將應(yīng)用于整篇文檔。例如，<bodytext=#FF0000>表示文本顏色設(shè)置為紅色。link、alink、vlink屬性：用于分別設(shè)置普通超鏈接、當前活動的超鏈接、已訪問的超鏈接文本的顏色。例如，<bodylink=#ccddeevlink=#ff3366alink=#66cc77>整理ppttopmargin、leftmargin屬性：用于設(shè)置網(wǎng)頁主體內(nèi)容與網(wǎng)頁頂端、左端的距離。例如，<bodytopmargin=0leftmargin=2>。上機作業(yè)：完成作業(yè)1.txt中的操作整理ppt13.DreamweaverCS4簡介翻開方法起始頁工作界面

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 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

提交評論