網(wǎng)頁(yè)設(shè)計(jì)部分.doc

網(wǎng)頁(yè)設(shè)計(jì)綜合練習(xí)A卷啟動(dòng)Dreamweaver 8，打開(kāi)C:KS文件夾中的WY1站點(diǎn)，并按下列要求在站點(diǎn)中修改網(wǎng)頁(yè)。 1打開(kāi)主頁(yè)index.htm，在網(wǎng)頁(yè)中插入一個(gè)2行2列的表格，按樣張?jiān)诒砀竦?行插入兩張圖片（圖片文件名為bar11.gif、bar12.gif）。 2在第2行左起第1列的單元格插入一段Javascript代碼（代碼在文件data1.txt中，插在HTML文本相應(yīng)位置中），以顯示計(jì)算機(jī)的當(dāng)前日期。 3將表格第2行第2列拆分成3列，按樣張?jiān)谶@3個(gè)單元格中加入三個(gè)超級(jí)鏈接，即：“主頁(yè)”與index.htm相鏈接，“表單”與xjh.jpg相鏈接，“電子郵件”與電子郵件地址“”相鏈接，三個(gè)超鏈接的目標(biāo)框架均為“新建窗口”。 4按樣張?jiān)诰W(wǎng)頁(yè)中，再插入一個(gè)2行2列的表格，在第1行第1列中存放test1.txt文件中第1、第2小節(jié)的內(nèi)容，在第1行第2列中插入一張圖片，圖片文件名為：tp11.jpg，按樣張對(duì)表格第2行的第1列、第2列進(jìn)行合并，存放test1.txt文件中第3小節(jié)的內(nèi)容。 5按樣張?jiān)诰W(wǎng)頁(yè)底部插入版權(quán)信息：桂林山水2006。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁(yè)中文字的位置可能與樣張略有差異，圖文混排效果與樣張大致相同。B卷啟動(dòng)Dreamweaver 8，打開(kāi)C:KS文件夾中的WY2站點(diǎn)，并按下列要求在站點(diǎn)中建立和修改網(wǎng)頁(yè)。 1在該網(wǎng)站中建立一個(gè)橫幅與目錄樣式的框架組織網(wǎng)頁(yè)，框架網(wǎng)頁(yè)文件名為index.htm，替代原來(lái)的index.htm主頁(yè)，上、左、右框架內(nèi)的網(wǎng)頁(yè)文件名分別為top.htm，left.htm和right.htm，各框架的大小與樣張基本相同即可，并使框架邊框不顯示。 2按樣張?jiān)趖op.htm網(wǎng)頁(yè)頂端插入二張圖片，圖片文件名為bar21.gif、bar22.gif。 3按樣張?jiān)趌eft.htm中插入一個(gè)3行1列的表格，輸入有關(guān)的文字，其中“主頁(yè)”與index.htm鏈接，目標(biāo)框架為“整頁(yè)”；“查詢”與tp11.jpg相鏈接，目標(biāo)框架為“新建窗口”；“電子郵件”與電子郵件信箱鏈接，郵件地址為：“”，將文字的各種鏈接顏色均設(shè)置為白色，鏈接無(wú)下劃線，將表格各個(gè)單元格的背景顏色設(shè)置為黑色。 4在right.htm網(wǎng)頁(yè)中，插入一個(gè)2行2列的表格，表格的第2行合并成1列，并按樣張?jiān)诒砀窀鲉卧裰写娣舤est2.txt文本中相應(yīng)的內(nèi)容和圖片（圖片文件tp21.jpg）。 5在right.htm網(wǎng)頁(yè)的最后一行，通過(guò)在HTML文本中插入一段Javascript代碼，Javascript代碼在文件wellcome.txt中。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁(yè)中文字的位置可能與樣張略有差異，圖文混排效果與樣張大致相同。C卷啟動(dòng)Dreamweaver 8，打開(kāi)C:KS文件夾中的WY3站點(diǎn)，并按下列要求在站點(diǎn)中修改網(wǎng)頁(yè)。 1打開(kāi)主頁(yè)index.htm，按樣張?jiān)诰W(wǎng)頁(yè)頂端插入一張圖片，圖片文件名為bar31.gif，并在bar31.gif上定義一個(gè)書簽，書簽名為XXX。 2按樣張?jiān)陧敹藞D片下插入一個(gè)寬度為50%的1行3列的居中表格，3個(gè)單元格中分別如樣張輸入有關(guān)的文字，其中“主頁(yè)”與index.htm鏈接，“查詢”與tp11.jpg相鏈接，“電子郵件”與電子郵件地址相鏈接。 3插入一個(gè)2行2列的表格，按樣張插入test3.txt文件的內(nèi)容和圖片（圖片文件名為：tp31.jpg。4按樣張?jiān)诰W(wǎng)頁(yè)底部插入一個(gè)超級(jí)鏈接“top”，位置居中，與上面所定義的書簽相鏈接。 5在網(wǎng)頁(yè)最下方插入字幕“歡迎光臨XXX個(gè)人站點(diǎn)”，將其表現(xiàn)設(shè)置為“交替”。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁(yè)中文字的位置可能與樣張略有差異，圖文混排效果與樣張大致相同。D卷啟動(dòng)Dreamweaver 8，打開(kāi)C:KS文件夾中的WY4站點(diǎn)，并按下列要求在站點(diǎn)中建立和修改網(wǎng)頁(yè)。 1在該網(wǎng)站中建立一個(gè)水平拆分樣式的框架組織網(wǎng)頁(yè)，框架網(wǎng)頁(yè)文件名為index.htm，替代原來(lái)的index.htm主頁(yè)，上、下框架內(nèi)的網(wǎng)頁(yè)文件名分別為top.htm，bottom.htm，各框架的大小與樣張基本相同即可，并使框架邊框不顯示。 2按樣張?jiān)趖op.htm網(wǎng)頁(yè)頂端插入一張名為bar41.gif圖片，在其右側(cè)插入一個(gè)flash插件，其flash文件名為bar42.swf。 3按樣張?jiān)赽ottom.htm網(wǎng)頁(yè)的左側(cè)插入一個(gè)3行1列的表格，每單元格按樣張插入文本并建立三個(gè)超級(jí)鏈接，“主頁(yè)”與index鏈接，目標(biāo)框架為整頁(yè)，“查詢”與xjh.jpg相鏈接，目標(biāo)框架為整頁(yè)，“電子郵件”與電子郵件地址相鏈接。 （提示：可先插入一個(gè)1行2列的表格。） 4通過(guò)設(shè)置，使已訪問(wèn)的超級(jí)鏈接的顏色、當(dāng)前超級(jí)鏈接和超級(jí)鏈接的顏色均為綠色。 5在bottom.htm網(wǎng)頁(yè)中插入一個(gè)2行2列的表格，第二行合并成一列，按樣張插入test4.txt文件的內(nèi)容和圖片，圖片文件為tp41.jpg，分別在該圖片的左邊部分和右邊部分定義兩個(gè)矩形熱點(diǎn)，左邊熱點(diǎn)所對(duì)應(yīng)的超鏈接為，右邊熱點(diǎn)所對(duì)應(yīng)的超鏈接為。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁(yè)中文字的位置可能與樣張略有差異，圖文混排效果與樣張大致相同。E卷啟動(dòng)Dreamweaver 8，打開(kāi)C:KS文件夾中的WY5站點(diǎn)，并按下列要求在站點(diǎn)中建立和修改網(wǎng)頁(yè)。 1在該網(wǎng)站中新建一個(gè)自頂向下的層次結(jié)構(gòu)樣式的框架組織網(wǎng)頁(yè)，框架網(wǎng)頁(yè)文件名為index.htm，替代原來(lái)的index.htm主頁(yè)。上、中、下框架內(nèi)的網(wǎng)頁(yè)文件名為top.htm，middle.htm和bottom.htm，上、中、下框的高度在框架網(wǎng)頁(yè)的比例分別為25%、60%和15%，并使框架邊框不顯示。 2按樣張?jiān)趖op.htm網(wǎng)頁(yè)插入一個(gè)1行3列的表格，在第1列中插入一張名為bar11.gif圖片，在第2列中插入圖片文件bar12.gif，要求在瀏覽時(shí)當(dāng)鼠標(biāo)停留到bar12.gif圖片上時(shí)能交換顯示bar72.gif圖片，當(dāng)移出鼠標(biāo)時(shí)則恢復(fù)交換圖片。 3按樣張將top.htm中右邊的單元格拆分成3行，如樣張輸入文字并設(shè)置三個(gè)超級(jí)鏈接，“主頁(yè)”與index.htm相鏈接，目標(biāo)框架均為“整頁(yè)”；“查詢”與xjh.jpg相鏈接，目標(biāo)框架均為“middle”；“電子郵件”與電子郵件鏈接，郵件地址為：。 4在middle.htm網(wǎng)頁(yè)中插入兩個(gè)1行2列的表格，按樣張分別在各單元格中插入test5.txt文件的內(nèi)容和文件名為tp51.gif和tp52.gif圖片。 5按樣張?jiān)赽ottom.htm網(wǎng)頁(yè)先插入一條藍(lán)色的水平線，再加入版權(quán)信息。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁(yè)中文字的位置可能與樣張略有差異，圖文混排效果與樣張大致相同。F卷啟動(dòng)Dreamweaver 8，打開(kāi)C:KS文件夾中的WY6站點(diǎn)，并按下列要求在站點(diǎn)中建立和修改網(wǎng)頁(yè)。 1按下列要求在該網(wǎng)站中新建文件名為form.htm的網(wǎng)頁(yè)，插入表單，各表單域的信息如下表所示。所顯示信息類型名稱格式、有效性規(guī)則選項(xiàng)按鈕或下拉菜單中的值姓名文本框Name寬度10性別兩個(gè)單選項(xiàng)按鈕Sexmale、female文化程度下拉菜單degree小學(xué)、中學(xué)、大學(xué) 2打開(kāi)主頁(yè)index.htm，按樣張?jiān)诰W(wǎng)頁(yè)頂端插入二張圖片，圖片文件名為bar61.gif、bar62.gif。 3按樣張?jiān)陧敹藞D片下插入一個(gè)1行4列的表格，在相應(yīng)單元格中插入Flash按鈕并設(shè)置超鏈接，“主頁(yè)”與index.htm相鏈接，“注冊(cè)”與form.htm相鏈接，“查詢”與文件tp11.jpg相鏈接，“電子郵件”與電子郵件地址相鏈接。 4在網(wǎng)頁(yè)中分別插入兩個(gè)1行2列的表格，按樣張插入test6.txt文件的內(nèi)容和文件名為tp61.gif、tp62.gif的兩張圖片。通過(guò)設(shè)置CSS樣式，將文字段落的行距設(shè)置為20像素。5按樣張?jiān)诰W(wǎng)頁(yè)底部插入滾動(dòng)顯示的字幕“歡迎光臨本站”。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁(yè)中文字的位置可能與樣張略有差異，圖文混排效果與樣張大致相同。G卷啟動(dòng)Dreamweaver 8，打開(kāi)C:KS文件夾中的WY7站點(diǎn)，并按下列要求在站點(diǎn)中修改網(wǎng)頁(yè)。 1打開(kāi)主頁(yè)index.htm，按樣張利用布局表格設(shè)計(jì)頁(yè)面，在第1行中分別插入二張圖片，圖片文件名為bar71.jpg、bar72.jpg。 2按樣張?jiān)诘?行居中位置插入日期（包括星期），要求能自動(dòng)更新。 3按樣張?jiān)诰W(wǎng)頁(yè)的左側(cè)單元格中插入文件名tp76.jpg的圖片，在該圖片上利用長(zhǎng)方形熱點(diǎn)加入3個(gè)超級(jí)鏈接,其中“首頁(yè)”與index.htm鏈接；“注冊(cè)”與xjh.jpg相鏈接；“聯(lián)系我”與電子郵件信箱鏈接，郵件地址，三個(gè)超鏈接的目標(biāo)均為“新建窗口”。 4按樣張?jiān)诰W(wǎng)頁(yè)的右側(cè)將test7.txt文件內(nèi)容和圖片tp75.gif存放在相應(yīng)單元格中。 5按樣張?jiān)陧?yè)面的左上角添加一個(gè)圖層，在其中插入bar11.gif圖片文件，然后利用時(shí)間軸設(shè)置其動(dòng)畫，使得瀏覽時(shí)該圖層能從左上角緩慢地移至右下角，動(dòng)畫總長(zhǎng)120幀。 注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁(yè)中文字的位置可能與樣張略有差異，圖文混排效果與樣張大致相同。H卷啟動(dòng)Dreamweaver 8，打開(kāi)C:KS文件夾中的WY8站點(diǎn)，并按下列要求在站點(diǎn)中修改網(wǎng)頁(yè)。 1打開(kāi)主頁(yè)index.htm，將網(wǎng)頁(yè)的標(biāo)題更改為：我的個(gè)人站點(diǎn)，將bg8.gif圖片文件作為頁(yè)面的背景圖片。 2按樣張?jiān)诰W(wǎng)頁(yè)頂端插入兩張flash圖片，flash文件名為bar81.swf、bar82.swf，調(diào)節(jié)flash圖片的大小與樣張大致相同即可。 3按樣張?jiān)陧敹藞D片下插入一個(gè)1行2列的表格，在左側(cè)單元格中插入名為tp82.gif圖片，為該圖片設(shè)置行為：顯示彈出式菜單（要求：水平菜單、居中顯示、邊框?qū)挾葹?），菜單選項(xiàng)中的“主頁(yè)”與index.htm相鏈接，“查詢”與xjh.jpg相鏈接，“電子郵件”與電子郵件地址相鏈接。 4按樣張