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

1、網(wǎng)頁設(shè)計(jì)綜合練習(xí)a卷啟動(dòng)dreamweaver 8,打開c:ks文件夾中的wy1站點(diǎn)，并按下列要求在站點(diǎn)中修改網(wǎng)頁。1. 打開主頁index, him,在網(wǎng)頁中插入一個(gè)2行2列的表格，按樣張?jiān)诒砀竦?行插入兩張圖片（圖 片文件名為 barl 1. gif> bar 12. gif）。2. 在第2行左起第1列的單元格插入一段javascript代碼（代碼在文件datal. txt中,插在html 文本相應(yīng)位置中），以顯示計(jì)算機(jī)的當(dāng)前h期。3. 將表格第2行第2列拆分成3列，按樣張?jiān)谶@3個(gè)單元格中加入三個(gè)超級鏈接，即：“主頁”少 index, htm相鏈接，“表單”與xjh. jpg相鏈接，

2、“電子郵件”與電子郵件地址“jsj”相鏈接,三個(gè)超鏈接的目標(biāo)框架均為“新建窗口”。4. 按樣張?jiān)诰W(wǎng)頁屮，再插入一個(gè)2行2列的表格，在第1行第1列屮存放testl.txt文件屮第1、 笫2小節(jié)的內(nèi)容，在笫1行笫2列中插入一張圖片，圖片文件名為：tpll.jpg,按樣張對表格第 2行的第1列、第2列進(jìn)行合并,存放testl. txt文件中第3小節(jié)的內(nèi)容。5. 按樣張?jiān)诰W(wǎng)頁底部插入版權(quán)信息：桂林山水©2006。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁中文字的位置可能與樣張略冇差異，圖文混排 效果與樣張人致相同。b卷啟動(dòng)dreamweaver 8,打開c:ks文件夾中的wy2站點(diǎn)，并按下

3、列要求在站點(diǎn)中建立和修改網(wǎng)頁。1. 在該網(wǎng)站中建立一個(gè)橫幅與目錄樣式的框架組織網(wǎng)頁，框架網(wǎng)頁文件名為index, htm,替代原來 的index, htm主頁，上、左、右框架內(nèi)的網(wǎng)頁文件名分別為top.htm, left.htm和right, htm, 各框架的大小與樣張某木相同即可，并使框架邊框不顯示。2. 按樣張?jiān)趖op. htm網(wǎng)頁頂端插入二張圖片,圖片文件名為bar21.gif、bar22.gif。3. 按樣張?jiān)趌eft, him中插入一個(gè)3行1列的表格，輸入有關(guān)的文字，其中"主頁”與indcx.htm 鏈接，目標(biāo)框架為“整頁”；“查詢”與tpll.jpg相鏈接,目標(biāo)框架為“

4、新建窗口”； “電子郵件” 與電子郵件信箱鏈接，郵件地址為：“. cm”，將文字的各種鏈接顏色均設(shè)置為 白色，鏈接無下劃線，將表格各個(gè)單元格的背景顏色設(shè)置為黑色。4. 在right.htm網(wǎng)頁中，插入一個(gè)2行2列的表格,表格的第2行合并成1列,并按樣張?jiān)诒砀窀?單元格中存放test2. txt文本中相應(yīng)的內(nèi)容和圖片（圖片文件tp21. jpg）o5. 在right, htm網(wǎng)頁的最后一行,通過在html文本中插入一段javascript代碼,javascript代 碼在文件wellcome, txt中。1. 打開主頁index, htm,按樣張?jiān)诰W(wǎng)頁頂端插入一張圖

5、片,圖片文件名為bar31. gif,并在bar31. gif上定義一個(gè)書簽，書簽名為xxx。2. 按樣張?jiān)陧敹藞D片下插入一個(gè)寬度為50%的1行3列的居屮表格，3個(gè)單元格屮分別如樣張輸入 有關(guān)的文字，其中“主頁”與index.htm鏈接，“查詢”與tpll.jpg相鏈接，“電子郵件”與電 子郵件地址xxxmail. shu. edu. on相鏈接。3. 插入一個(gè)2行2列的表格,按樣張插入test3.txt文件的內(nèi)容和圖片（圖片文件名為:tp31.jpg。4. 按樣張?jiān)诰W(wǎng)頁底部插入一個(gè)超級鏈接“top”，位置居中，與上面所定義的書簽相鏈接。5. 在網(wǎng)頁最下方插入字幕“歡迎光臨xxx個(gè)人站點(diǎn)”，將

6、其表現(xiàn)設(shè)置為“交替”。注意：由于顯示器分辨率或窗口人小的不同，網(wǎng)頁屮文字的位置可能與樣張略有差異，圖文混排 效果與樣張人致相同。d卷啟動(dòng)dreamweaver 8,打開c:ks文件夾中的wy4站點(diǎn)，并按f列要求在站點(diǎn)中建立和修改網(wǎng)頁。1. 在該網(wǎng)站屮建立一個(gè)水平拆分樣式的框架組織網(wǎng)頁，框架網(wǎng)頁文件名為index.htm,替代原來的 index, htm主頁,上、下框架內(nèi)的網(wǎng)頁文件名分別為top. htm, bottom, htm,各框架的大小與樣 張基本相同即可，并使椎架邊框不顯示。2. 按樣張?jiān)趖op. htm網(wǎng)頁頂端插入一張名為bar41. gif圖片，在其右側(cè)插入一個(gè)flash插件，其

7、flash 文件名為 bar42. swf。3. 按樣張?jiān)赽ottom, htm網(wǎng)頁的左側(cè)插入一個(gè)3行1列的表格，每單元格按樣張插入文本并建立三 個(gè)超級鏈接，“主頁”與index鏈接，日標(biāo)框架為整頁，“杳詢”與xjh. jpg相鏈接，日標(biāo)框架為 整頁，“電了郵件”與電子郵件地址xxx相鏈接。（提示：可先插入一個(gè)1行2列的表格。）4. 通過設(shè)置，使已訪問的超級鏈接的顏色、當(dāng)前超級鏈接和超級鏈接的顏色均為綠色。5. 在bottom, him網(wǎng)頁中插入一個(gè)2行2歹u的表格,第二行合并成一列，按樣張插入test4. txt文 件的內(nèi)容和圖片，圖片文件為tpll.jpg,分別在該圖片的左邊部分和右邊部分

8、定義兩個(gè)矩形熱 點(diǎn)，左邊熱點(diǎn)所対應(yīng)的超鏈接為http:/www. shu. edu. cn ,右邊熱點(diǎn)所對應(yīng)的超鏈接為 http:/www. eastday. com。1. 在該網(wǎng)站中新建一個(gè)口頂向卜的層次結(jié)構(gòu)樣式的框架組織網(wǎng)頁，框架網(wǎng)頁文件名為index, htm, 替代原來的index, htm主頁。上、中、下框架內(nèi)的網(wǎng)頁文件名為top. htm, middle, htm和 bottom, htm,上、中、下框的高度在框架網(wǎng)頁的比例分別為25%、60%和15%,并使框架邊框不顯2. 按樣張?jiān)趖op. htm網(wǎng)頁插入一個(gè)1行3列的表格，在第1列中插入一張名為barll.gif圖片，在 第2列

9、屮插入圖片文件barl2. gif,要求在瀏覽時(shí)當(dāng)鼠標(biāo)停留到barl2. gif圖片上時(shí)能交換顯示 bar72. gif圖片，當(dāng)移出鼠標(biāo)時(shí)則恢復(fù)交換圖片。3. 按樣張將top. htm中右邊的單元格拆分成3行，如樣張輸入文字并設(shè)置三個(gè)超級鏈接，“主頁” 與index, htm相鏈接,目標(biāo)框架均為“整頁”;“查詢”與xjh. jpg相鏈接,目標(biāo)框架均為“middle”；“電子郵件”與電子郵件鏈接,郵件地址為:xxx。4. 在middle, htm網(wǎng)頁中插入兩個(gè)1行2列的表格，按樣張分別在各單元格中插入test5. txt文件 的內(nèi)容和文件名為tp51. gif和tp52. gif圖片。5. 按樣

10、張?jiān)赽ottom, htm網(wǎng)頁先插入一條藍(lán)色的水平線，再加入版權(quán)信息。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁屮文字的位證對能與樣張略有差異，圖文混排 效果與樣張人致相同。f卷啟動(dòng)dreamweaver 8,打開c:ks文件夾中的wy6站點(diǎn),并按f列要求在站點(diǎn)中建立和修改網(wǎng)頁。1.按下列要求在該網(wǎng)站中新建文件名為form, htm的網(wǎng)頁，插入表單，各表單域的信息如下表所示。所顯示信息類型名稱格式、有效性規(guī)則選項(xiàng)按鈕或下拉菜單中的值姓名文木框name寬度10性別兩個(gè)單選項(xiàng)按鈕sexmale、 female文化程度f拉菜單degree小學(xué)、屮學(xué)、人學(xué)2. 打開主頁index, htm,按樣張?jiān)?/p>

11、網(wǎng)頁頂端插入二張圖片，圖片文件名為bar61.gif、bar62.gif。3. 按樣張?jiān)陧敹藞D片卜-插入一個(gè)1行4列的表格，在相應(yīng)單元格屮插入flash按鈕并設(shè)置超鏈接,"主頁”與index, htm ffl鏈接，“注冊”與form, htm相鏈接，"查詢”與文件tpll.jpg相鏈接, "電子郵件"與電子郵件地址xxxhotmail. com相鏈接。4. 在網(wǎng)頁中分別插入兩個(gè)1行2列的表格，按樣張插入test6. txt文件的內(nèi)容和文件名為tp61. gif、tp62.gif的兩張圖片。通過設(shè)置css樣式，將文字段落的行距設(shè)置為20像索。5. 按樣張?jiān)?/p>

12、網(wǎng)頁底部插入滾動(dòng)顯示的字幕“歡迎光臨木站”。1. 打開主頁index.htm,按樣張利用布局表格設(shè)計(jì)頁面，在第1行中分別插入二張圖片，圖片文件 名為 bar71.jpg、bar72.jpg。2. 按樣張?jiān)诘?行居屮位置插入fi期（包插星期），要求能自動(dòng)更新。3. 按樣張?jiān)诰W(wǎng)頁的左側(cè)單元格中插入文件名tp76. jpg的圖片，在該圖片上利用長方形熱點(diǎn)加入3 個(gè)超級鏈接，其中“首頁”與index, htni鏈接；“注冊”與xjh. jpg相鏈接；“聯(lián)系我”與電子郵 件信箱鏈接，郵件地址xxx,三個(gè)超鏈接的冃標(biāo)均為“新建窗口”。4. 按樣張?jiān)诰W(wǎng)頁的右側(cè)將test7. txt文件內(nèi)容和圖片tp75.

13、gif存放在相應(yīng)單元格屮。5. 按樣張?jiān)陧撁娴淖笊辖翘砑右粋€(gè)圖層，在其中插入barll.gif圖片文件，然后利用時(shí)間軸設(shè)置其 動(dòng)畫，使得瀏覽吋該圖層能從左上角緩慢地移至右下角，動(dòng)畫總長120幀。注意：由于顯示器分辨率或窗口大小的不同，網(wǎng)頁中文字的位置可能與樣張略有差界，圖文混排 效果與樣張人致相同。h卷啟動(dòng)dreamweaver 8,打開c:ks文件夾中的wy8站點(diǎn)，并按卜列要求在站點(diǎn)中修改網(wǎng)頁。1. 打開主頁index, htm,將網(wǎng)頁的標(biāo)題更改為:我的個(gè)人站點(diǎn),將bg& gif圖片文件作為頁面的背 景圖片。2. 按樣張?jiān)诰W(wǎng)頁頂端插入兩張flash圖片，flash文件名為bar81. swfx bar82. swf,調(diào)節(jié)flash圖 片的大小與樣張大致相同即可。3. 按樣張?jiān)陧敹藞D片下插入一個(gè)1行2列的表格，在左側(cè)單元格中插入名為tp82.gif圖片，為該 圖片設(shè)置行為：顯示彈出式菜單（要求：水平菜單、屈中顯示、邊框?qū)挾葹?）,菜單選項(xiàng)中的 “主頁”與index, htm相鏈接，“查詢”與xjh. jpg相鏈接，“電子郵件”