網(wǎng)頁制作上機練習(xí)_第1頁
網(wǎng)頁制作上機練習(xí)_第2頁
網(wǎng)頁制作上機練習(xí)_第3頁
網(wǎng)頁制作上機練習(xí)_第4頁
已閱讀5頁，還剩16頁未讀， 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

1、實驗一使用 Dreamweaver 創(chuàng)建簡單頁面一、實驗?zāi)康?、掌握 HTML 的基本結(jié)構(gòu)2、熟悉 Dreamweaver的工作環(huán)境3、掌握不同的視圖下的操作及面板的使用4、會使用 Dreamweaver 創(chuàng)建、管理站點二、實驗內(nèi)容1、在 Dreamweaver 中創(chuàng)建一個站點（ 1）新建一個以自己學(xué)號或姓名拼音命名的文件夾（ 2）在 Dreamweaver中新建站點，把站點設(shè)為新建的文件夾（ 3）觀察創(chuàng)建站點前后的區(qū)別2、利用所學(xué)知識創(chuàng)建一個個人信息頁面（ 1）新建一個 HTML 頁面，添加標題為“個人簡介”（ 2）利用文字、水平線、特殊符號、背景顏色、背景圖片等制作簡單的個人信息頁面3、制

2、作一個中轉(zhuǎn)頁面（ 1）制作一個簡單頁面，添加標題和簡單內(nèi)容（ 2）通過設(shè)置 <meta>標記，實現(xiàn) 10 秒后自動跳轉(zhuǎn)到個人信息頁面實驗二超級鏈接與文本修飾一、實驗?zāi)康?、掌握超級鏈接的不同創(chuàng)建方法2、了解錨點鏈接的作用，并會創(chuàng)建錨點鏈接3、熟悉文本的不同修飾方法二、實驗內(nèi)容1、創(chuàng)建“大話西游”頁面（ 1）字體與背景顏色等自行設(shè)計，要求搭配合理（ 2）第一行右上角有 “聯(lián)系我們”，點擊鏈接到（ 3）第二行為標題，居中顯示（ 4）內(nèi)容要求不使用空格或換行等，居中顯示如下：曾經(jīng)有一份真誠的愛情放在我面前，我沒有珍惜，等我失去的時候我才后悔莫及，人世間總痛苦的事莫過于此。（5）下面有“下

3、載”兩字，創(chuàng)建一個下載鏈接2、創(chuàng)建“我的影院”主頁面（ 1）字體與背景顏色等自行設(shè)計，要求搭配合理（ 2）第一行為標題（ 3）第二行為影院分類， 例如：歐美電影、港臺電影、大陸電影、等，格式為“標題 1”，要求自左向右滾動顯示，鼠標移動時停止?jié)L動，移開時繼續(xù)滾動（ 4）以下為電影名字，每個類型電影下都有相應(yīng)的電影，要求每個名字單獨一行， 必須超過一屏； 點擊第二行的電影類型會自動跳轉(zhuǎn)到下面相應(yīng)的地方；同時港臺電影中包括“大話西游” ，點擊它可以轉(zhuǎn)到“大話西游”詳細介紹頁面。（ 5）右下角有“返回頂部” ，要求點擊它能夠返回到頁面的最上方?！?+命名錨記名稱”實驗三綜合練習(xí)（一）一、實驗?zāi)康?、

4、復(fù)習(xí)前面所學(xué)的知識點2、掌握在代碼視圖中使用標記及屬性的相關(guān)方法3、掌握屬性窗口的使用方法4、掌握 IIS 的設(shè)置方法二、實驗內(nèi)容1、根據(jù)所有知識設(shè)計兩個相關(guān)的頁面（ 1）字體與背景顏色等自行設(shè)計，要求搭配合理，且必須使用的是字體 <font> 或頁面 <body>標記的相關(guān)屬性（ 2）兩個頁面通過超級鏈接關(guān)聯(lián)，主頁面內(nèi)容設(shè)置必須合理（ 3）頁面內(nèi)容不作要求，可以使任何自己感興趣的東西（ 4）主頁面上必須有當前系統(tǒng)的日期（ 5）使用并體會段落符號與換行符號的區(qū)別（ 6）使用并體會預(yù)先格式化標記 <pre>的作用（ 7）使用并體會字幕標記 <marque

5、e>的作用（ 8）必須使用并體會錨點鏈接的作用2、設(shè)置 IIS（1）在控制面板的管理工具里面打開并配置IIS（2）設(shè)置完成后，同學(xué)之間通過IP 地址互相訪問所作頁面3、檢查并測試大家對知識點的掌握程度實驗四列表、圖像及簡單頁面布局一、實驗?zāi)康?、掌握三種列表的創(chuàng)建方法2、掌握圖像的插入方法及圖文混排的具體操作3、會創(chuàng)建簡單的表格4、會使用框架來布局頁面5、了解層并能夠正確的使用它二、實驗內(nèi)容1、創(chuàng)建一個簡單的個人簡歷頁面（ 1）用項目列表組織簡歷，項目符號為實心方形；包含三項內(nèi)容：基本資料、教育背景、技能水平（ 2）基本資料部分用表格設(shè)計，大致如下圖所示，空白部分自己填入信息姓名性別出生

6、年月政治面貌插入照片畢業(yè)院校所學(xué)專業(yè)聯(lián)系方式（3）其余兩部分可用編號列表設(shè)計2、創(chuàng)建一個地圖頁面（ 1）使用畫圖工具畫一個大致的中國地圖，要求至少有兩個地理位置，比如：湖北和自己家鄉(xiāng)的位置等；也可用類似圖片替代（ 2）點擊不同的位置能連接到相應(yīng)的頁面，所鏈接頁面可只有簡單文字說明（ 3）圖片右邊添加對中國的簡單文字說明，要求文字與圖片上方對齊3、創(chuàng)建一個框架頁面（ 1）創(chuàng)建一個框架頁面，大致如下圖所示；上面的文字是保存時的文件名，最外層頁面名字統(tǒng)一命名為 index.html ；框架名稱用括號內(nèi)的名字Top.html（top）Left.html （left） Main.html （main）（

7、 2 ）框架 top 中添加“我的網(wǎng)頁”，加粗居中（ 3）框 架 left 中有兩行文字，分別為“作者介紹”和“作品介紹”（ 4）框 架 main 中添加一張圖片，在圖片中間添加介紹性文字（5）為“作者介紹”和“作品介紹”分別添加超級鏈接，鏈接到1、2 部分所完成的頁面中； 要求“作者介紹” 是打開一個新的窗口；“作品介紹”在框 架 main 中顯示。實驗五表格的美化及頁面布局一、實驗?zāi)康?、會對表格的美化2、能夠使用表格進行頁面布局二、實驗內(nèi)容1、美化表格（ 1）對實驗四中的表格進行美化（ 2）要求表格的邊框為紫色，且線條為 1 個象素的單條線；表格內(nèi)部顏色為前灰色2、設(shè)計一個網(wǎng)站首頁（ 1

8、）主題不限，要求顏色搭配合理（ 2）至少必須包含頁面頭部，頁面主體和頁面底部三部分（ 3）頁面頭部是 LOGO 、BANNER 、導(dǎo)航等內(nèi)容（ 4）頁面主體內(nèi)容應(yīng)根據(jù)自己的網(wǎng)站主題細化，至少必須有每部分的標題，內(nèi)容可以簡化（ 5）頁面底部是版權(quán)信息， 應(yīng)包含自己的學(xué)號姓名等，且居中顯示。實驗六層及 CSS 樣式一、實驗?zāi)康?、會制作層的動態(tài)效果2、掌握 CSS 樣式的創(chuàng)建方法，并會應(yīng)用3、了解外部樣式表和內(nèi)部樣式表的區(qū)別4、特殊表格的制作二、實驗內(nèi)容1、制作一個藝術(shù)系的介紹頁面（ 1）要求制作的 CSS樣式能夠被很多頁面使用， 也就是外部樣式表，可保存為 style.css（ 2）通過添加 C

9、SS 樣式，要求沒有進行任何設(shè)置前頁面文字都是紅色， 10pt 的大?。?3）通過添加 CSS 樣式，要求添加的圖片都有邊框（ 3）通過添加 CSS 樣式，實現(xiàn)第一行居中顯示“藝術(shù)系風(fēng)采” ，且藍色， 24pt 大?。?4）下面是對藝術(shù)系的簡單介紹，必須有文字和圖片2、層的簡單動態(tài)效果（可參考P103）（ 1）添加三個層，內(nèi)容分別為：學(xué)校簡介、系部介紹、管理部門（ 2）當鼠標移到“系部介紹”時顯示它的下拉菜單，包含生物技術(shù)、制藥工程、藝術(shù)系等；移到“管理部門”時顯示它的下拉菜單，包含教務(wù)處、財務(wù)處等（ 3）點擊“藝術(shù)系”時，鏈接到第一題中制作的頁面（ 4）通過添加 CSS樣式，實現(xiàn)超級鏈接沒有

10、下劃線，且不同狀態(tài)的顯示不同，要求使用的還是第一題中的 style.css表3、特殊表格的制作嘗試制作一個如下圖所示的表格實驗七層布局設(shè)計及模板的使用一、實驗?zāi)康?、會使用層及 CSS 樣式布局頁面2、掌握行為的添加方法3、了解代碼片段的使用4、掌握模板的創(chuàng)建及套用方法二、實驗內(nèi)容1、使用層制作一個如下圖所示的網(wǎng)站首頁（1）結(jié)構(gòu)如下圖所示（ 2）主題不限，要求顏色搭配合理（ 3）頁面頭部是 LOGO 、BANNER 、導(dǎo)航等內(nèi)容（ 4）頁面主體內(nèi)容應(yīng)根據(jù)自己的網(wǎng)站主題細化，至少必須有每部分的標題，內(nèi)容可以簡化（ 5）頁面底部是版權(quán)信息， 應(yīng)包含自己的學(xué)號姓名等，且居中顯示。2、行為的使用（ 1

11、）頁面添加標題：“行為的使用”，可使用 CSS樣式（ 2）當打開頁面時自動添加彈出消息： “歡迎您的光臨！”（ 3）單擊時打開一個 400*300 的窗口，內(nèi)容顯示的是第 1 部分做好的頁面，此窗口有標題欄3、模板的創(chuàng)建（ 1）創(chuàng)建一個模板頁面（ 2）新建一個 HTML 頁面，套用上述模板，并進行編輯（ 3）修改模板頁面，查看保存時發(fā)生的變化。實驗八綜合練習(xí)（二）一、實驗?zāi)康?、掌握模板的創(chuàng)建方法及使用2、能靈活使用表格、層、行為等技術(shù)3、會靈活使用 CSS 樣式4、掌握常用的頁面布局方法二、實驗內(nèi)容1、使用模板制作一個簡單網(wǎng)站（ 1）主題不限，要求顏色搭配合理（ 2）除模板外，頁面應(yīng)不少于兩

12、個（ 3）首頁要求導(dǎo)航部分是固定的，不可修改的；且必須用到類似下圖的的格式，可水平可垂直方向； 當鼠標經(jīng)過時會出現(xiàn)相應(yīng)的下拉菜單，并可以鏈接到相應(yīng)的頁面（ 4）其它頁面都有“返回首頁”的鏈接；涉及到的超級鏈接都是沒有下劃線的（ 5）主要內(nèi)容都是可以編輯、修改的2、設(shè)置 IIS（1）在控制面板的管理工具里面打開并配置IIS（2）設(shè)置完成后，同學(xué)之間通過IP 地址互相訪問所作頁面3、檢查并測試大家對知識點的掌握程度實驗九庫技術(shù)及表單的使用一、實驗?zāi)康?、掌握庫的創(chuàng)建方法及使用2、了解表單及表單元素之間的關(guān)系，并會創(chuàng)建表單3、熟悉常用表單元素的功能，知道何時使用哪種表單元素4、能實現(xiàn)表單的跳轉(zhuǎn)，并了

13、解表單提交的兩種不同方法的區(qū)別二、實驗內(nèi)容1、制作一個如下圖所示的表單頁面（ 1）預(yù)覽時的最初效果應(yīng)跟上圖一致（ 2）用戶名和密碼長度為 20，輸入的字符控制在 16 個以內(nèi)，若超過則不能再輸入；密碼以“ *”或“”顯示（ 3）性別只能選擇一個（ 4）點擊“注冊”時提交到另外一個頁面，顯示為“注冊成功！ ”；點擊“重置”時恢復(fù)初始界面，重新輸入2、庫的使用（ 1）把表單頁面的“性別”那一欄保存為庫，并命名為“ xb.lbi ”（ 2）在另外一個頁面套用此庫（ 3）修改“xb.lbi ”文件，把“男”改為“男孩”，“女”改為“女孩”，并查看使用庫頁面的變化（ 4）在使用了庫的頁面進行分離庫的操作

14、實驗十簡單交互技術(shù)一、實驗?zāi)康?、復(fù)習(xí)表單的創(chuàng)建及提交方法2、會使用行為檢查表單3、能夠使用 ASP VBScript 獲取表單的信息并顯示4、能夠區(qū)分開服務(wù)器端代碼和瀏覽器端代碼二、實驗內(nèi)容1、新建站點，配置IIS2、制作一個可以簡單交互的表單頁面（ 1）預(yù)覽時的最初效果應(yīng)跟上圖一致（ 2）要求用戶名和密碼都不能為空，且密碼必須為數(shù)字類型，否則提示錯誤信息（ 3）新建一個 ASP VBScript 頁面并保存（ 3）點擊“登錄”時提交到新建的 ASP VBScript 頁面，顯示為“歡迎* 登錄本網(wǎng)站！”（* 是表單頁面輸入的用戶名） ；點擊“重置”時恢復(fù)初始界面，重新輸入（ 4）在 IIS

15、 中進行測試3、嘗試數(shù)據(jù)庫的鏈接與顯示（ 1）在 OFFICE 中，新建一 ACCESS 數(shù)據(jù)庫，名稱為自己姓名的拼音縮寫；使用設(shè)計器創(chuàng)建一包含字段 username、password；username為主鍵的表，命名為user；雙擊打開，輸入3-5 條記錄（ 2）在控制面板 -管理工具 -系統(tǒng) DSN 中，創(chuàng)建 ODBC 數(shù)據(jù)源為自己創(chuàng)建的數(shù)據(jù)庫（ 3）在 DreamWeaver中新建站點， 配置測試服務(wù)器， 打開“數(shù)據(jù)庫”面板（ 4）新建一 ASP VBScript 頁面，使用“數(shù)據(jù)庫”面板的數(shù)據(jù)源名稱（ DSN）進行數(shù)據(jù)庫連接，使用 “綁定”，顯示數(shù)據(jù)庫中的第一個用戶名，測試數(shù)據(jù)庫連接是

16、否成功實驗 11 數(shù)據(jù)庫基本操作一、實驗?zāi)康?、掌握簡單的ACCESS 數(shù)據(jù)庫的創(chuàng)建方法2、會配置數(shù)據(jù)源3、掌握使用數(shù)據(jù)庫面板操作數(shù)據(jù)庫的方法二、實驗內(nèi)容1、用戶注冊及登陸的實現(xiàn)（ 1）新建一個 ASP VBScript 頁面，添加一個至少包含用戶名和密碼，及注冊按鈕的表單，命名為 zc.asp（ 2）復(fù)制此頁面，修改“注冊”按鈕為“登陸” ，命名為 dl.asp（ 3）新建一 ACCESS 數(shù)據(jù)庫，創(chuàng)建一名為 user 的表，包含字段username、password；username為主鍵；并配置數(shù)據(jù)源為此數(shù)據(jù)庫（ 4）回到 zc.asp 頁面，打開數(shù)據(jù)庫面板，連接接數(shù)據(jù)庫；實現(xiàn)點擊注冊按鈕時，存輸入的信息到數(shù)據(jù)庫中，并在新的頁面顯示“注冊成功”（ 5）打開 dl.asp 頁面，實現(xiàn)點擊登陸按鈕時，若用戶名和密碼存在，則顯示“登陸成功”，否則顯示“登陸失敗”（ 6）顯示成功或失敗的頁面可用僅有文字的 HTML 頁面來表示2、制作一個簡易的新聞發(fā)布系統(tǒng)（1）在原來的數(shù)據(jù)庫中添加一張表，可命名為news，主要存放新聞信息，包含標題、內(nèi)容、發(fā)布者等字段，字段名稱自己命名（ 2）新建

溫馨提示

  • 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

提交評論