網頁制作上機練習_第1頁
網頁制作上機練習_第2頁
網頁制作上機練習_第3頁
網頁制作上機練習_第4頁
已閱讀5頁,還剩16頁未讀 繼續免費閱讀

下載本文檔

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

文檔簡介

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

溫馨提示

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

評論

0/150

提交評論