第一篇:網(wǎng)頁制作實(shí)驗(yàn)報(bào)告
網(wǎng)頁制作實(shí)驗(yàn)報(bào)告
實(shí)驗(yàn)一:站點(diǎn)設(shè)置
一、實(shí)驗(yàn)?zāi)康募耙?/p>
本實(shí)例是通過“站點(diǎn)定義為”對話框中的“高級”選項(xiàng)卡創(chuàng)建一個(gè)新站點(diǎn)。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows
xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver
mx;flash
mx;fireworks
mx)等網(wǎng)頁設(shè)計(jì)軟件;
三、實(shí)驗(yàn)原理
通過“站點(diǎn)定義為”對話框中的“高級”選項(xiàng)卡創(chuàng)建一個(gè)新站點(diǎn)。
四、實(shí)驗(yàn)方法與步驟
1)執(zhí)行“站點(diǎn)\管理站點(diǎn)”命令,在彈出的“管理站點(diǎn)”對話框中單擊“新建”按鈕,在彈出的快捷菜單中選擇“站點(diǎn)”命令。
2)在彈出的“站點(diǎn)定義為”對話框中單擊“高級”選項(xiàng)卡。
3)在“站點(diǎn)名稱”文本框中輸入站點(diǎn)名稱,在“默認(rèn)文件夾”文本框中選擇所創(chuàng)建的站點(diǎn)文件夾。在“默認(rèn)圖象文件夾”文本框中選擇存放圖象的文件夾,完成后單擊“確定”按鈕,返回“管理站點(diǎn)”對話框。
4)在“管理站點(diǎn)”對話框中單擊“完成”按鈕,站點(diǎn)創(chuàng)建完畢。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
實(shí)驗(yàn)開始之前要先建立一個(gè)根文件夾,在實(shí)驗(yàn)的過程中把站點(diǎn)存在自己建的文件夾里,這樣才能使實(shí)驗(yàn)條理化,不至于在實(shí)驗(yàn)后找不到自己的站點(diǎn)。在實(shí)驗(yàn)過程中會(huì)出現(xiàn)一些選項(xiàng),計(jì)算機(jī)一般會(huì)有默認(rèn)的選擇,最后不要去更改,如果要更改要先充分了解清楚該選項(xiàng)的含義,以及它會(huì)造成的效果,否則會(huì)使實(shí)驗(yàn)的結(jié)果失真。實(shí)驗(yàn)前先熟悉好操作軟件是做好該實(shí)驗(yàn)的關(guān)鍵。
實(shí)驗(yàn)二:頁面圖像設(shè)置
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是設(shè)置頁面的背景圖像,并創(chuàng)建鼠標(biāo)經(jīng)過圖像。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows
xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver
mx;flash
mx;fireworks
mx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
設(shè)置頁面的背景圖像,并創(chuàng)建鼠標(biāo)經(jīng)過圖像。
四、實(shí)驗(yàn)方法與步驟
1)
在“頁面屬性”對話框中設(shè)置頁面的背景圖像。
2)
在頁面文檔中單擊“”插入鼠標(biāo)經(jīng)過圖像。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
實(shí)驗(yàn)結(jié)束后我們可以看到頁面的背景變成了我們插入的圖像,并且要鼠標(biāo)經(jīng)過的時(shí)候會(huì)變成另一個(gè)圖像,這就是鼠標(biāo)經(jīng)過圖像的效果。當(dāng)然這種實(shí)驗(yàn)效果很難在實(shí)驗(yàn)結(jié)果的截圖里表現(xiàn)出來。這個(gè)實(shí)驗(yàn)的關(guān)鍵在于背景圖像的選擇,如果背景圖像太大不僅會(huì)影響網(wǎng)頁的打開速度,甚至圖像在插入會(huì)也會(huì)有失真的感覺,因此在插入前對圖像進(jìn)行必要的處理能使實(shí)驗(yàn)的效果更好。
實(shí)驗(yàn)三:表格制作
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例是要?jiǎng)?chuàng)建邊框?yàn)?像素的表格。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows
xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver
mx;flash
mx;fireworks
mx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建邊框?yàn)?像素的表格。
四、實(shí)驗(yàn)方法與步驟
1)
在文檔中,單擊表格“”按鈕,在對話框中將“單元格間距”設(shè)置為“1”。
2)
選中插入的表格,將“背景顏色”設(shè)置為“黑色”(#0000000)。
3)
在表格中選中所有的單元格,在“屬性”面版中將“背景顏色”設(shè)置為“白色”(#ffffff)。
4)
設(shè)置完畢,保存頁面,按下“f12”鍵預(yù)覽。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
本實(shí)驗(yàn)主要通過整個(gè)表格和單元格顏色的差異來襯托出實(shí)驗(yàn)效果,間距的作用主要在于表現(xiàn)這種顏色差異。表格的背景顏色和單元格的背景顏色容易混淆,在實(shí)驗(yàn)中要認(rèn)真判斷,一旦操作錯(cuò)誤則得不到實(shí)驗(yàn)的效果?!氨砀駥挾取蔽谋究蛴覀?cè)的表格的寬度單位,包括“像素”和“百分比”兩種,容易混淆,要充分地理解這兩種單位表示的意義才能正確地進(jìn)行選擇,否則就不能達(dá)到自己想要的效果,設(shè)置錯(cuò)誤就會(huì)嚴(yán)重影響實(shí)驗(yàn)效果。
實(shí)驗(yàn)四:創(chuàng)建錨點(diǎn)鏈接
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是創(chuàng)建錨點(diǎn)鏈接。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows
xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver
mx;flash
mx;fireworks
mx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
第二篇:網(wǎng)頁制作實(shí)驗(yàn)報(bào)告格式
這是一篇由xiexiebang.com范文網(wǎng)小編整理的關(guān)于網(wǎng)頁制作實(shí)驗(yàn)報(bào)告格式的文章,希望對尊敬的xiexiebang.com范文大全的讀者有幫助。
實(shí)驗(yàn)一:站點(diǎn)設(shè)置
一、實(shí)驗(yàn)?zāi)康募耙?/p>
本實(shí)例是通過“站點(diǎn)定義為”對話框中的“高級”選項(xiàng)卡創(chuàng)建一個(gè)新站點(diǎn)。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver mx;flash mx;fireworks mx)等網(wǎng)頁設(shè)計(jì)軟件;
三、實(shí)驗(yàn)原理
通過“站點(diǎn)定義為”對話框中的“高級”選項(xiàng)卡創(chuàng)建一個(gè)新站點(diǎn)。
四、實(shí)驗(yàn)方法與步驟
1)執(zhí)行“站點(diǎn)管理站點(diǎn)”命令,在彈出的“管理站點(diǎn)”對話框中單擊“新建”按鈕,在彈出的快捷菜單中選擇“站點(diǎn)”命令。
2)在彈出的“站點(diǎn)定義為”對話框中單擊“高級”選項(xiàng)卡。
3)在“站點(diǎn)名稱”文本框中輸入站點(diǎn)名稱,在“默認(rèn)文件夾”文本框中選擇所創(chuàng)建的站點(diǎn)文件夾。在“默認(rèn)圖象文件夾”文本框中選擇存放圖象的文件夾,完成后單擊“確定”按鈕,返回“管理站點(diǎn)”對話框。
4)在“管理站點(diǎn)”對話框中單擊“完成”按鈕,站點(diǎn)創(chuàng)建完畢。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
實(shí)驗(yàn)開始之前要先建立一個(gè)根文件夾,在實(shí)驗(yàn)的過程中把站點(diǎn)存在自己建的文件夾里,這樣才能使實(shí)驗(yàn)條理化,不至于在實(shí)驗(yàn)后找不到自己的站點(diǎn)。在實(shí)驗(yàn)過程中會(huì)出現(xiàn)一些選項(xiàng),計(jì)算機(jī)一般會(huì)有默認(rèn)的選擇,最后不要去更改,如果要更改要先充分了解清楚該選項(xiàng)的含義,以及它會(huì)造成的效果,否則會(huì)使實(shí)驗(yàn)的結(jié)果失真。實(shí)驗(yàn)前先熟悉好操作軟件是做好該實(shí)驗(yàn)的關(guān)鍵。
實(shí)驗(yàn)二:頁面圖像設(shè)置
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是設(shè)置頁面的背景圖像,并創(chuàng)建鼠標(biāo)經(jīng)過圖像。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver mx;flash mx;fireworks mx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
設(shè)置頁面的背景圖像,并創(chuàng)建鼠標(biāo)經(jīng)過圖像。
四、實(shí)驗(yàn)方法與步驟
1)在“頁面屬性”對話框中設(shè)置頁面的背景圖像。
2)在頁面文檔中單擊“”插入鼠標(biāo)經(jīng)過圖像。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
實(shí)驗(yàn)結(jié)束后我們可以看到頁面的背景變成了我們插入的圖像,并且要鼠標(biāo)經(jīng)過的時(shí)候會(huì)變成另一個(gè)圖像,這就是鼠標(biāo)經(jīng)過圖像的效果。當(dāng)然這種實(shí)驗(yàn)效果很難在實(shí)驗(yàn)結(jié)果的截圖里表現(xiàn)出來。這個(gè)實(shí)驗(yàn)的關(guān)鍵在于背景圖像的選擇,如果背景圖像太大不僅會(huì)影響網(wǎng)頁的打開速度,甚至圖像在插入會(huì)也會(huì)有失真的感覺,因此在插入前對圖像進(jìn)行必要的處理能使實(shí)驗(yàn)的效果更好。
實(shí)驗(yàn)三:表格制作
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例是要?jiǎng)?chuàng)建邊框?yàn)?像素的表格。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver mx;flash mx;fireworks mx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建邊框?yàn)?像素的表格。
四、實(shí)驗(yàn)方法與步驟
1)在文檔中,單擊表格“”按鈕,在對話框中將“單元格間距”設(shè)置為“1”。
2)選中插入的表格,將“背景顏色”設(shè)置為“黑色”(#0000000)。
3)在表格中選中所有的單元格,在“屬性”面版中將“背景顏色”設(shè)置為“白色”(#ffffff)。
4)設(shè)置完畢,保存頁面,按下“f12”鍵預(yù)覽。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
本實(shí)驗(yàn)主要通過整個(gè)表格和單元格顏色的差異來襯托出實(shí)驗(yàn)效果,間距的作用主要在于表現(xiàn)這種顏色差異。表格的背景顏色和單元格的背景顏色容易混淆,在實(shí)驗(yàn)中要認(rèn)真判斷,一旦操作錯(cuò)誤則得不到實(shí)驗(yàn)的效果?!氨砀駥挾取蔽谋究蛴覀?cè)的表格的寬度單位,包括“像素”和“百分比”兩種,容易混淆,要充分地理解這兩種單位表示的意義才能正確地進(jìn)行選擇,否則就不能達(dá)到自己想要的效果,設(shè)置錯(cuò)誤就會(huì)嚴(yán)重影響實(shí)驗(yàn)效果。
實(shí)驗(yàn)四:創(chuàng)建錨點(diǎn)鏈接
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是創(chuàng)建錨點(diǎn)鏈接。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver mx;flash mx;fireworks mx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建錨點(diǎn)鏈接。
四、實(shí)驗(yàn)方法與步驟
1)在頁面中插入1行4列的表格,并在各單元格中輸入導(dǎo)航文字。
2)分別選中各單元格的文字,單擊“”按鈕,在彈出的“超級鏈接”對話框上的“鏈接”文本框分別輸入“#01”“#02”“#03”“#04”。
3)在文檔中輸入文字并設(shè)置錨記名稱“01”,按下“ enter”鍵換行,輸入一篇文章。
4)在文章的結(jié)尾處換行,輸入文字并設(shè)置錨記名稱“02”,按下“ enter”鍵換行,輸入一篇文章。
5)同樣的方法在頁面下文分別輸入文字和命名錨記為“03”和“04”,并輸入文章。
6)保存頁面,按下“f12”鍵預(yù)覽。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
添加瞄記的作用是可以幫讀者快速找到自己想要的文章,同時(shí)也可以使頁面更加精簡。本實(shí)驗(yàn)的關(guān)鍵難點(diǎn)在于鏈接文本框輸入的名稱和瞄記的名稱要相一致才能達(dá)到實(shí)驗(yàn)的效果,同時(shí)要記得是在上一篇文章的結(jié)尾處輸入文字并設(shè)置瞄記名稱,并記得輸入對應(yīng)的文章,否則瞄記可能不能用。熟練程度低在實(shí)驗(yàn)中不能很好地使用各種工具,無法一次準(zhǔn)確地尋找到適當(dāng)?shù)奈恢?。?shí)驗(yàn)中忘記選擇“不可見元素”,幾次實(shí)驗(yàn)都失敗,最后才得出正確的結(jié)論。因此在實(shí)驗(yàn)前要先做好預(yù)習(xí),否則實(shí)驗(yàn)過程會(huì)比較吃力。
實(shí)驗(yàn)五:設(shè)置css樣式
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是通過設(shè)置css樣式創(chuàng)建表格的虛線邊框。
xiexiebang.com范文網(wǎng)【004km.cn】
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windows xp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweaver mx;flash mx;fireworks mx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
通過設(shè)置css樣式創(chuàng)建表格的虛線邊框。
四、實(shí)驗(yàn)方法與步驟
1)在網(wǎng)頁中創(chuàng)建一個(gè)表格。
2)在“css樣式”面板中單擊“”按鈕,在彈出的對話框中進(jìn)行設(shè)置,完成后單擊“確定”按鈕。
3)在彈出的對話框中進(jìn)行設(shè)置,完成后單擊“確定”按鈕。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
對話框中各項(xiàng)指標(biāo)和屬性的設(shè)置存在一定的難度,如果沒熟練掌握就容易出錯(cuò)使實(shí)驗(yàn)失敗。對“ccs”樣式所要使用的各種按扭不夠熟悉在使用的時(shí)候覺得很生硬。這個(gè)實(shí)驗(yàn)成功的關(guān)鍵在于對軟件的掌握程度以及對各種屬性的認(rèn)識(shí)程度,只要充分地掌握了軟件的各種操作,對各屬性所代表的含義有充分的認(rèn)識(shí)就能很好地完成這個(gè)實(shí)驗(yàn)。
實(shí)驗(yàn)六:創(chuàng)建表單
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是創(chuàng)建一個(gè)募捐表單。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建一個(gè)募捐表單。
四、實(shí)驗(yàn)方法與步驟
1)在網(wǎng)頁中插入表格,設(shè)置為居中對齊,并插入一幅圖像。
2)在表格的第二行單元格中,單擊“”按鈕,插入表單。
3)在表單域中插入表單對象和文字。
4)按下“F12”鍵,預(yù)覽效果。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
這個(gè)圖像關(guān)鍵首先在于背景圖象的選擇,圖像如果過于花俏則會(huì)使表單過于雜亂,如果顏色過深則會(huì)掩蓋了表單上的字,依次最好不要用黑色。圖像也不能過大,不然會(huì)使表單太繁雜。其次是各多選框和單選按扭的設(shè)置難度比較大,對于初次做這個(gè)實(shí)驗(yàn)的人來說需要多次的試驗(yàn)才能達(dá)到滿意的效果。表格拆分的難度大,要多次實(shí)驗(yàn)才能達(dá)到自己想要的效果。
實(shí)驗(yàn)七:頁面中控制播放Flash動(dòng)畫
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是實(shí)現(xiàn)在頁面中控制播放Flash動(dòng)畫。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
實(shí)現(xiàn)在頁面中控制播放Flash動(dòng)畫。
四、實(shí)驗(yàn)方法與步驟
1)在頁面中插入表格,并在表格中插入Flash動(dòng)畫和兩個(gè)表單按鈕。
2)分別選擇兩個(gè)表單按鈕,在“行為”面板中單擊“”按鈕,在彈出的快捷菜單中選擇“控制Shockwave或Flash”命令,打開“控制Shockwave或Flash”對話框,分別設(shè)置。
3)保存頁面,按下“F12”鍵預(yù)覽。單擊“播放”按鈕時(shí),開始播放Flash動(dòng)畫;當(dāng)單擊“停止”按鈕時(shí),則停止播放Flash動(dòng)畫。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
“控制Shockwave或Flash”對話框,設(shè)置難度比較大,設(shè)置錯(cuò)誤FLASH可能無法播放。控制按鈕的創(chuàng)建也是關(guān)鍵所在,控制按鈕不能使用則等于整個(gè)實(shí)驗(yàn)的失敗,因此要認(rèn)真做好各個(gè)按鈕并確保質(zhì)量。在這次實(shí)驗(yàn)中我遇到的最大問題就是設(shè)置“控制Shockwave或Flash”對話框,因?yàn)槲覍ζ涓黜?xiàng)的屬性了解不夠清楚,在選擇時(shí)很難正確地做出判斷,因此掌握好這方面的知識(shí)是做好這個(gè)實(shí)驗(yàn)的前提。
實(shí)驗(yàn)八:制作浮雕文字
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例使用Flash的繪畫工具制作出的有浮雕感的文字。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
使用Flash的繪畫工具制作出的有浮雕感的文字。
四、實(shí)驗(yàn)方法與步驟
1)在舞臺(tái)中輸入文本,并將文本移動(dòng)到舞臺(tái)中央位置。
2)新建圖層2,并復(fù)制圖層1的第1幀到圖層2的第1幀,并改變字體顏色。
3)拖曳圖層2到圖層1的下方,分別按下鍵盤上的方向鍵的左移鍵和上移鍵各一次。
4)新建圖層3,復(fù)制圖層2的第1幀到圖層3的第1幀,并拖曳圖層3到圖層1的上方。
5)選擇圖層3的第1幀,執(zhí)行“修改分離”命令兩次,將文本打散,并填充為由白色(#FFFFFF)漸變到黃色(#FFFFF00)。
6)分別按下兩次鍵盤上的方向鍵中的左移鍵和下稱鍵,拖曳圖層3到圖層1的下方,該實(shí)例制作完成。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
掌握好層和楨的知識(shí)是做好這個(gè)實(shí)驗(yàn)的關(guān)鍵,因?yàn)檫@個(gè)實(shí)驗(yàn)主要涉及到楨和層的創(chuàng)建和移動(dòng),對層和楨不熟悉,在選擇和移動(dòng)時(shí)沒法準(zhǔn)確地把握,否則就打不到預(yù)期的實(shí)驗(yàn)效果。此次實(shí)驗(yàn)需要多次地移動(dòng)層和楨,只有合理地移動(dòng)才能達(dá)到實(shí)驗(yàn)效果,因此在實(shí)驗(yàn)中要保持清醒的頭腦,也需要耐心和細(xì)心,過于急噪就會(huì)影響實(shí)驗(yàn)的效果和效率。
實(shí)驗(yàn)九:字母位置顏色的變化效果
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例主要表現(xiàn)在有字母的位置才能看到顏色的變化效果。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
表現(xiàn)在有字母的位置才能看到顏色的變化效果。
四、實(shí)驗(yàn)方法與步驟
1)執(zhí)行“文件導(dǎo)入導(dǎo)入到庫”命令,導(dǎo)入一個(gè)圖像文件到“庫”面板中。
2)將圖像文件拖曳到舞臺(tái)并轉(zhuǎn)換為圖形元件,然后創(chuàng)建移動(dòng)補(bǔ)間動(dòng)畫。
3)新建圖層2,輸入文本并設(shè)置其屬性。
4)將圖層2設(shè)置為遮罩層,完成本實(shí)例的制作。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
這個(gè)實(shí)驗(yàn)的前提是要學(xué)會(huì)做移動(dòng)補(bǔ)間動(dòng)畫,因?yàn)橐苿?dòng)補(bǔ)間動(dòng)畫是表現(xiàn)實(shí)驗(yàn)效果的關(guān)鍵,其次要懂得遮罩層的設(shè)置,這兩項(xiàng)都是實(shí)驗(yàn)的關(guān)鍵。背景圖像的選擇也很關(guān)鍵,如果背景圖像的顏色過于單一,則不能很好地表現(xiàn)實(shí)驗(yàn)的效果,字體顏色的變化也會(huì)比較不明顯。因此這個(gè)實(shí)驗(yàn)的技術(shù)含量比較大,因此難度也比較大,要有耐心去認(rèn)真研究。
實(shí)驗(yàn)十:動(dòng)作補(bǔ)間動(dòng)畫及聲音效果
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例首先創(chuàng)建一個(gè)動(dòng)作補(bǔ)間動(dòng)畫,然后在對其添加聲音效果。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建一個(gè)動(dòng)作補(bǔ)間動(dòng)畫,然后在對其添加聲音效果。
四、實(shí)驗(yàn)方法與步驟
1)創(chuàng)建圖形元件在舞臺(tái)中繪制一個(gè)卡通人物。
2)創(chuàng)建卡通人物越飛越遠(yuǎn)的動(dòng)作補(bǔ)間動(dòng)畫。
3)新建一個(gè)圖層,導(dǎo)入一幅背景圖片,并置位于最下層。
4)執(zhí)行“文件導(dǎo)入導(dǎo)入到庫命令”,導(dǎo)入一個(gè)聲音文件。新建一個(gè)圖層,并選擇第1幀,在幀“屬性”面板中,在“聲音”下拉列表中選擇導(dǎo)入的聲音文件名稱,在“同步”下拉列表中選擇“數(shù)據(jù)流”選項(xiàng),其他選項(xiàng)為默認(rèn)值。
5)保存文件,按下“Ctrl+ Enter”組合鍵輸出影片即可。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
這個(gè)實(shí)驗(yàn)首先要?jiǎng)?chuàng)建圖形元件,因此要求對畫圖工具有比較清楚的了解,在實(shí)驗(yàn)中我遇到最大的難題就是沒法準(zhǔn)確地使用鋼筆工具,常常畫不成自己想要的形狀,最后通過查閱相關(guān)的書籍才徹底明白它的使用方法。這個(gè)實(shí)驗(yàn)涉及到動(dòng)作補(bǔ)間動(dòng)畫的制作,和以前做的移動(dòng)補(bǔ)間動(dòng)畫有一定的區(qū)別,在實(shí)驗(yàn)中要認(rèn)真區(qū)分。導(dǎo)聲音文件也是這個(gè)實(shí)驗(yàn)新涉及的內(nèi)容,在各項(xiàng)屬性的設(shè)置方面要認(rèn)真把握和學(xué)習(xí)。
實(shí)驗(yàn)十一:Action Script腳本程序制作
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例模擬播放器中音頻高低顯示的效果。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
本實(shí)例模擬播放器中音頻高低顯示的效果。本例是一個(gè)完全由Action Script腳本程序制作的圖形動(dòng)畫。
四、實(shí)驗(yàn)方法與步驟
1)開啟Flash MX 2004,新建一個(gè)空白文檔,執(zhí)行“修改文檔”命令,開啟“文檔屬性”對話框,修改屬性參數(shù)為:寬:600px;高:300px;背景顏色#000000。
2)執(zhí)行“窗口開發(fā)面板動(dòng)作”命令,為圖層1添加如下動(dòng)作腳本。
-root.On Enter Frame= function()
{
create Empty Movie Clip(“ caidai ”, random(2))
caidai.–X= 150;
caidai.–Y=200;
for(var i =0<12:i++)
{
cai dai.begin FilL(Math.Random()*0xffffff,60)
var gaodu= Math.Random()*50+10;
var xzuobiao= [i*30,i*30+20,i*30+20, i*30]
var yzvobiao=[-gaodu,-gaodu,0,0]
caidai, moveTo(i*30,o)
for(var j=0;<5;j++)
{caidai, Line To(xzuo biao[j],yzuobio[j]);
}
}
}
3)按下“Ctrl+ S”組合鍵保存文件,執(zhí)行“控制測試影片”命令,欣賞本例完成后的效果。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
這個(gè)實(shí)驗(yàn)主要是操作Flash MX,雖然這個(gè)實(shí)驗(yàn)整體的步驟很簡單,但是腳本程序的正確性決定著這個(gè)實(shí)驗(yàn)的成敗,因此在實(shí)驗(yàn)中要認(rèn)真分析腳本并對其進(jìn)行不斷的調(diào)試使其能正確地運(yùn)行。而這方面對程序方面的知識(shí)有比較高的要求因此對于我們非計(jì)算機(jī)類的學(xué)生來說難度比較大,如果要做好這個(gè)實(shí)驗(yàn)我們必須加強(qiáng)學(xué)習(xí)程序方面的知識(shí)。
實(shí)驗(yàn)十二:創(chuàng)建一個(gè)特效字
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本章上機(jī)實(shí)訓(xùn)的目的是創(chuàng)建一個(gè)特效字。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建一個(gè)特效字。
四、實(shí)驗(yàn)方法與步驟
1)新建一個(gè)Fireworks文檔,并輸入文字,將字體加粗,字號設(shè)置為120。
2)將文字轉(zhuǎn)化為路徑,在“屬性”面板中單擊“”按鈕,在彈出的快捷菜單中選擇“陰影和光暈投影”命令,如圖15-42所示。
3)選中文本對象,執(zhí)行“編輯克隆”命令。選中克隆對象,執(zhí)行“修改改變路徑擴(kuò)展筆觸”命令,在彈出的“展開筆觸”對話框中設(shè)置為如圖15-43所示。特效字制作完畢。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
Fireworks 軟件的打開速度比較慢,而且會(huì)影響計(jì)算機(jī)的反應(yīng)速度,同時(shí)使用DREEMWAVER和FIREWORKS會(huì)使整個(gè)電腦很卡,因此這個(gè)實(shí)驗(yàn)需要比較好的計(jì)算機(jī)系統(tǒng)的支持。對 “陰影和光暈投影”命令我還不能比較深刻地理解在實(shí)驗(yàn)的時(shí)候有點(diǎn)迷糊,對“編輯克隆”命令和“修改改變路徑擴(kuò)展筆觸”命令我也存在同樣的困惑,因此做好實(shí)驗(yàn)前的準(zhǔn)備是順利地完成實(shí)驗(yàn)的關(guān)鍵。
實(shí)驗(yàn)十三:繪制一個(gè)效果圖
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本上機(jī)實(shí)訓(xùn)的目的是繪制一個(gè)效果圖。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
繪制一個(gè)效果圖。
四、實(shí)驗(yàn)方法與步驟
1)用橢圓工具和鋼筆工具分別繪制出企鵝的身體和翅膀。
2)執(zhí)行“修改組合路徑聯(lián)合”命令,聯(lián)合途徑,并填充為黑色。
3)用橢圓工具繪制眼睛,并用鋼筆工具構(gòu)出腳丫、嘴、圍巾、和肚皮,并填充相應(yīng)的顏色。
4)將所有的部分放到相應(yīng)的位置,本例制作完畢。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
這個(gè)實(shí)驗(yàn)很多要用到橢圓工具和鋼筆工具,因此要先熟悉地掌握他們的使用方法,多看課本并進(jìn)行一些實(shí)驗(yàn)操作能比較快地掌握它們的使用方法。實(shí)驗(yàn)時(shí)要分別地繪制出企鵝各部分的圖形元件然后執(zhí)行“修改組合路徑聯(lián)合”命令,聯(lián)合途徑,因此在實(shí)驗(yàn)切記不能把整個(gè)圖象作為繪制的對象,否則就不能達(dá)到實(shí)驗(yàn)效果,操作的難度也會(huì)加大。同時(shí)對 “修改組合路徑聯(lián)合”命令要深入了解才能在適當(dāng)?shù)臅r(shí)間和位置使用。
實(shí)驗(yàn)十四:創(chuàng)建管道圖像
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例是創(chuàng)建一個(gè)如管道圖像,并通過“優(yōu)化”面板對圖像進(jìn)行優(yōu)化導(dǎo)出。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建一個(gè)如管道圖像,并通過“優(yōu)化”面板對圖像進(jìn)行優(yōu)化導(dǎo)出。
四、實(shí)驗(yàn)方法與步驟
1)新建一個(gè)圖像文檔,繪制一個(gè)矩形,并將其設(shè)置為線性填充。
2)用鋼筆工具繪制一個(gè)路徑,并將其設(shè)置為放射狀填充,作為管道的拐角。
3)復(fù)制所創(chuàng)建的拐角和線性矩形,并進(jìn)行縮放和組合。
4)選擇“垂直線3”紋理“25%”設(shè)置為粗管道。
5)設(shè)置一幅背景圖像,用鋼筆工具勾畫出閃光的效果。執(zhí)行“窗口優(yōu)化”命令,將“優(yōu)化”面板進(jìn)行設(shè)置。
6)設(shè)置完成后,執(zhí)行“文件導(dǎo)出”命令,在“導(dǎo)出”對話框中選擇導(dǎo)出的路徑,完成后單擊“保存”按鈕。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
橫向的管道繪制比較簡單,效果也比較明顯,豎向和拐角的管道繪制的難度很大,經(jīng)常做了對多次還不能達(dá)到理想的效果,由也反應(yīng)了我們對實(shí)驗(yàn)工具的熟練程度不夠,在今后的學(xué)習(xí)中要加強(qiáng)這方面的學(xué)習(xí)。填充設(shè)置和“垂直線3”紋理“25%”設(shè)置是達(dá)到實(shí)驗(yàn)效果關(guān)鍵,因此要認(rèn)真地了解它代表的意義,然后認(rèn)真地進(jìn)行設(shè)置。正確地選擇背景圖像,也是達(dá)到實(shí)驗(yàn)效果的關(guān)鍵。
實(shí)驗(yàn)十五:創(chuàng)建圖像熱點(diǎn)和切片
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)訓(xùn)的主要目的是創(chuàng)建圖像熱點(diǎn)和切片。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建圖像熱點(diǎn)和切片。
四、實(shí)驗(yàn)方法與步驟
1)打開,執(zhí)行“文件打開”命令,打開一幅圖像。
2)使用矩形熱點(diǎn)工具在圖像的文字位置處創(chuàng)建熱點(diǎn)鏈接。
3)分別選擇矩形切片工具和多邊形切片工具,在圖像中創(chuàng)建切片。
4)執(zhí)行“文件導(dǎo)出”命令,在“導(dǎo)出”對話框中選擇切片和HTML文檔。打開導(dǎo)出的HTML文件觀看。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
這個(gè)實(shí)驗(yàn)的操作相對比較簡單,花費(fèi)的時(shí)間也比較少。在實(shí)驗(yàn)中能明顯地體會(huì)到實(shí)驗(yàn)的效果但是在預(yù)覽后很難看出處理后的圖像和原始圖像的區(qū)別,因此常常產(chǎn)生實(shí)驗(yàn)失敗的錯(cuò)覺,就因?yàn)檫@個(gè)錯(cuò)覺我進(jìn)行了多次的實(shí)驗(yàn),最后與其他同學(xué)討論過才發(fā)現(xiàn)這是實(shí)驗(yàn)的正?,F(xiàn)象,因此在實(shí)驗(yàn)中多與同學(xué)交流是學(xué)習(xí)的好方法。
實(shí)驗(yàn)十六:其他動(dòng)畫制作及圖形處理軟件介紹
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)訓(xùn)的主要目的是了解其他動(dòng)畫制作及圖形處理軟件的基本使用。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝Windows Xp操作系統(tǒng);建立IIS服務(wù)器環(huán)境,支持ASp。
3、安裝網(wǎng)頁三劍客(Dreamweaver MX;Flash MX;Fireworks MX)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝Acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
了解其他動(dòng)畫制作及圖形處理軟件的基本使用。
四、實(shí)驗(yàn)方法與步驟
根據(jù)教師所介紹的其他動(dòng)畫制作及圖形處理軟件,進(jìn)行相關(guān)的基本使用操作。本實(shí)驗(yàn)可以與其它實(shí)驗(yàn)相結(jié)合進(jìn)行。
1)AcdSee圖形處理軟件
2)SWFText(Flash文字制作工具)1.2 Raindy漢化修正版軟件使用
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
這個(gè)軟件是一個(gè)簡單易懂的軟件,操作起來也比較方便,相對于pHOTOSHOp軟件這個(gè)軟比較達(dá)到效果,但是這個(gè)軟件的能動(dòng)性比較低,我們只能被動(dòng)地使用里面所包含的各項(xiàng)設(shè)置但是不能能動(dòng)地繪制自己想要的圖片,各項(xiàng)屬性的設(shè)置也是只能從中選擇。因此如果只是簡單的制作可以采用這個(gè)軟件,但是如果想做自己特色的東西就要選擇更高級點(diǎn)的軟件。
xiexiebang.com范文大全將繼續(xù)為您提供關(guān)于網(wǎng)頁制作實(shí)驗(yàn)報(bào)告格式的文章,請繼續(xù)關(guān)注xiexiebang.com范文網(wǎng)。
第三篇:網(wǎng)頁制作實(shí)驗(yàn)報(bào)告
網(wǎng)頁制作實(shí)驗(yàn)報(bào)告
實(shí)驗(yàn)一:站點(diǎn)設(shè)置
一、實(shí)驗(yàn)?zāi)康募耙?/p>
本實(shí)例是通過“站點(diǎn)定義為”對話框中的“高級”選項(xiàng)卡創(chuàng)建一個(gè)新站點(diǎn)。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windowsxp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweavermx;flashmx;fireworksmx)等網(wǎng)頁設(shè)計(jì)軟件;
三、實(shí)驗(yàn)原理
通過“站點(diǎn)定義為”對話框中的“高級”選項(xiàng)卡創(chuàng)建一個(gè)新站點(diǎn)。
四、實(shí)驗(yàn)方法與步驟
1)執(zhí)行“站點(diǎn)\管理站點(diǎn)”命令,在彈出的“管理站點(diǎn)”對話框中單擊“新建”按鈕,在彈出的快捷菜單中選擇“站點(diǎn)”命令。
2)在彈出的“站點(diǎn)定義為”對話框中單擊“高級”選項(xiàng)卡。
3)在“站點(diǎn)名稱”文本框中輸入站點(diǎn)名稱,在“默認(rèn)文件夾”文本框中選擇所創(chuàng)建的站點(diǎn)文件夾。在“默認(rèn)圖象文件夾”文本框中選擇存放圖象的文件夾,完成后單擊“確定”按鈕,返回“管理站點(diǎn)”對話框。
4)在“管理站點(diǎn)”對話框中單擊“完成”按鈕,站點(diǎn)創(chuàng)建完畢。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
實(shí)驗(yàn)開始之前要先建立一個(gè)根文件夾,在實(shí)驗(yàn)的過程中把站點(diǎn)存在自己建的文件夾里,這樣才能使實(shí)驗(yàn)條理化,不至于在實(shí)驗(yàn)后找不到自己的站點(diǎn)。在實(shí)驗(yàn)過程中會(huì)出現(xiàn)一些選項(xiàng),計(jì)算機(jī)一般會(huì)有默認(rèn)的選擇,最后不要去更改,如果要更改要先充分了解清楚該選項(xiàng)的含義,以及它會(huì)造成的效果,否則會(huì)使實(shí)驗(yàn)的結(jié)果失真。實(shí)驗(yàn)前先熟悉好操作軟件是做好該實(shí)驗(yàn)的關(guān)鍵。
實(shí)驗(yàn)二:頁面圖像設(shè)置
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是設(shè)置頁面的背景圖像,并創(chuàng)建鼠標(biāo)經(jīng)過圖像。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windowsxp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweavermx;flashmx;fireworksmx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
設(shè)置頁面的背景圖像,并創(chuàng)建鼠標(biāo)經(jīng)過圖像。
四、實(shí)驗(yàn)方法與步驟
1)在“頁面屬性”對話框中設(shè)置頁面的背景圖像。
2)在頁面文檔中單擊“”插入鼠標(biāo)經(jīng)過圖像。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
實(shí)驗(yàn)結(jié)束后我們可以看到頁面的背景變成了我們插入的圖像,并且要鼠標(biāo)經(jīng)過的時(shí)候會(huì)變成另一個(gè)圖像,這就是鼠標(biāo)經(jīng)過圖像的效果。當(dāng)然這種實(shí)驗(yàn)效果很難在實(shí)驗(yàn)結(jié)果的截圖里表現(xiàn)出來。這個(gè)實(shí)驗(yàn)的關(guān)鍵在于背景圖像的選擇,如果背景圖像太大不僅會(huì)影響網(wǎng)頁的打開速度,甚至圖像在插入會(huì)也會(huì)有失真的感覺,因此在插入前對圖像進(jìn)行必要的處理能使實(shí)驗(yàn)的效果更好。
實(shí)驗(yàn)三:表格制作
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例是要?jiǎng)?chuàng)建邊框?yàn)?像素的表格。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windowsxp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweavermx;flashmx;fireworksmx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建邊框?yàn)?像素的表格。
四、實(shí)驗(yàn)方法與步驟
1)在文檔中,單擊表格“”按鈕,在對話框中將“單元格間距”設(shè)置為“1”。
2)選中插入的表格,將“背景顏色”設(shè)置為“黑色”(#0000000)。
3)在表格中選中所有的單元格,在“屬性”面版中將“背景顏色”設(shè)置為“白色”(#ffffff)。
4)設(shè)置完畢,保存頁面,按下“f12”鍵預(yù)覽。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
本實(shí)驗(yàn)主要通過整個(gè)表格和單元格顏色的差異來襯托出實(shí)驗(yàn)效果,間距的作用主要在于表現(xiàn)這種顏色差異。表格的背景顏色和單元格的背景顏色容易混淆,在實(shí)驗(yàn)中要認(rèn)真判斷,一旦操作錯(cuò)誤則得不到實(shí)驗(yàn)的效果?!氨砀駥挾取蔽谋究蛴覀?cè)的表格的寬度單位,包括“像素”和“百分比”兩種,容易混淆,要充分地理解這兩種單位表示的意義才能正確地進(jìn)行選擇,否則就不能達(dá)到自己想要的效果,設(shè)置錯(cuò)誤就會(huì)嚴(yán)重影響實(shí)驗(yàn)效果。
實(shí)驗(yàn)四:創(chuàng)建錨點(diǎn)鏈接
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是創(chuàng)建錨點(diǎn)鏈接。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windowsxp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweavermx;flashmx;fireworksmx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
創(chuàng)建錨點(diǎn)鏈接。
四、實(shí)驗(yàn)方法與步驟
1)在頁面中插入1行4列的表格,并在各單元格中輸入導(dǎo)航文字。
2)分別選中各單元格的文字,單擊“”按鈕,在彈出的“超級鏈接”對話框上的“鏈接”文本框分別輸入“#01”“#02”“#03”“#04”。
3)在文檔中輸入文字并設(shè)置錨記名稱“01”,按下“enter”鍵換行,輸入一篇文章。
4)在文章的結(jié)尾處換行,輸入文字并設(shè)置錨記名稱“02”,按下“enter”鍵換行,輸入一篇文章。
5)同樣的方法在頁面下文分別輸入文字和命名錨記為“03”和“04”,并輸入文章。
6)保存頁面,按下“f12”鍵預(yù)覽。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
添加瞄記的作用是可以幫讀者快速找到自己想要的文章,同時(shí)也可以使頁面更加精簡。本實(shí)驗(yàn)的關(guān)鍵難點(diǎn)在于鏈接文本框輸入的名稱和瞄記的名稱要相一致才能達(dá)到實(shí)驗(yàn)的效果,同時(shí)要記得是在上一篇文章的結(jié)尾處輸入文字并設(shè)置瞄記名稱,并記得輸入對應(yīng)的文章,否則瞄記可能不能用。熟練程度低在實(shí)驗(yàn)中不能很好地使用各種工具,無法一次準(zhǔn)確地尋找到適當(dāng)?shù)奈恢?。?shí)驗(yàn)中忘記選擇“不可見元素”,幾次實(shí)驗(yàn)都失敗,最后才得出正確的結(jié)論。因此在實(shí)驗(yàn)前要先做好預(yù)習(xí),否則實(shí)驗(yàn)過程會(huì)比較吃力。
實(shí)驗(yàn)五:設(shè)置css樣式
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是通過設(shè)置css樣式創(chuàng)建表格的虛線邊框。
二、儀器用具
1、生均一臺(tái)多媒體電腦,組建內(nèi)部局域網(wǎng),并且接入國際互聯(lián)網(wǎng)。
2、安裝windowsxp操作系統(tǒng);建立iis服務(wù)器環(huán)境,支持asp。
3、安裝網(wǎng)頁三劍客(dreamweavermx;flashmx;fireworksmx)等網(wǎng)頁設(shè)計(jì)軟件;
4、安裝acdsee、photoshop等圖形處理與制作軟件;
5、其他一些動(dòng)畫與圖形處理或制作軟件。
三、實(shí)驗(yàn)原理
通過設(shè)置css樣式創(chuàng)建表格的虛線邊框。
四、實(shí)驗(yàn)方法與步驟
1)在網(wǎng)頁中創(chuàng)建一個(gè)表格。
2)在“css樣式”面板中單擊“”按鈕,在彈出的對話框中進(jìn)行設(shè)置,完成后單擊“確定”按鈕。
3)在彈出的對話框中進(jìn)行設(shè)置,完成后單擊“確定”按鈕。
五、實(shí)驗(yàn)結(jié)果
六、討論與結(jié)論
對話框中各項(xiàng)指標(biāo)和屬性的設(shè)置存在一定的難度,如果沒熟練掌握就容易出錯(cuò)使實(shí)驗(yàn)失敗。對“ccs”樣式所要使用的各種按扭不夠熟悉在使用的時(shí)候覺得很生硬。這個(gè)實(shí)驗(yàn)成功的關(guān)鍵在于對軟件的掌握程度以及對各種屬性的認(rèn)識(shí)程度,只要充分地掌握了軟件的各種操作,對各屬性所代表的含義有充分的認(rèn)識(shí)就能很好地完成這個(gè)實(shí)驗(yàn)。
實(shí)驗(yàn)六:創(chuàng)建表單
一、實(shí)驗(yàn)?zāi)康募耙螅?/p>
本實(shí)例的目的是創(chuàng)建一個(gè)募捐表單。
第四篇:簡單網(wǎng)頁制作實(shí)驗(yàn)報(bào)告
《大學(xué)計(jì)算機(jī)基礎(chǔ)》 專業(yè)名稱學(xué)號:xxxxxxxxxxx 姓名:xx 指導(dǎo)教師:xx 實(shí)驗(yàn)報(bào)告
2011年12月24日
目 錄
第一章 網(wǎng)站主題設(shè)計(jì)說明.....................1
1.1 主題內(nèi)容..........................1
1.2 設(shè)計(jì)思路....................1
第二章 網(wǎng)站內(nèi)容設(shè)計(jì).................2
1.1 鏈接1標(biāo)題........................2
1.2 鏈接2標(biāo)題.........................2
1.3 flash制作說明......................2
第三章 網(wǎng)站技術(shù)難點(diǎn)................3
第四章 心得體會(huì)..................................4
第一章網(wǎng)站主題設(shè)計(jì)說明
1.1主題內(nèi)容….……................1
網(wǎng)站主題為“四季の花”,包括春夏秋冬四個(gè)季節(jié)的比較典型的花朵及有關(guān)花的詩句,色彩繽紛,十分艷麗奪目。
1.2設(shè)計(jì)思路………………………………………………2
大多網(wǎng)站都設(shè)計(jì)的關(guān)于音樂,影視,購物等非常熱門的東西,本站設(shè)計(jì)的主題是花,能讓人們在閑下來的時(shí)候看看花,品品詩歌,所以做有關(guān)花的網(wǎng)頁是個(gè)不錯(cuò)的選擇。同時(shí),讓人們分清楚春夏秋冬都各有什么典型的花。
第二章 網(wǎng)站內(nèi)容設(shè)計(jì)
1.1鏈接1標(biāo)題:春の花
春天是生命的季節(jié),在這個(gè)季節(jié)里,萬物復(fù)蘇。所以就找了虞美人,桃花,牡丹,以及海棠花來作為春天的代表。同時(shí)配有與這些花有關(guān)的詩句。
1.2 鏈接2標(biāo)題:夏の花
夏天充滿了激情與陽光,我找了蘭花,荷花,百合花等來代表這個(gè)季節(jié),色彩艷麗,十分醒目奪人。
1.3 鏈接3標(biāo)題:秋の花
大麗花,菊花,月季和牡丹花都競相出現(xiàn)在本網(wǎng)頁,色彩繽紛,賞心悅目。
1.4 鏈接4標(biāo)題:冬の花
蝴蝶蘭,水仙,迎春花,梅花是冬季的代表,他們刻畫了一副傲立冬天的堅(jiān)強(qiáng)的姿態(tài)。
網(wǎng)站技術(shù)難點(diǎn)
在制作網(wǎng)頁時(shí),要插入很多的圖片,而為了清晰,圖片都是尺寸比較大的,所以每次插入圖片時(shí)都要進(jìn)行調(diào)整圖片小這一工作,十分麻煩。同時(shí)為了觀看網(wǎng)頁方便,我便每頁都創(chuàng)建了可以連接到任意網(wǎng)頁的導(dǎo)航欄,所以此工作也是十分繁瑣麻煩的。網(wǎng)頁的布局同時(shí)也是一個(gè)難點(diǎn),為了美觀,則要不斷調(diào)整各圖片的大小,色彩搭配以及很多背景色及字體顏色。還有,對于素材的選取也要認(rèn)真篩選,否則整個(gè)網(wǎng)頁做完 看上去十分不協(xié)調(diào)。
心得體會(huì)
制作網(wǎng)頁是一個(gè)循序漸進(jìn)的過程,我們要在不斷練習(xí)的過程中,學(xué)會(huì)怎樣去連接,怎么去插入圖片,怎么選擇一個(gè)合適的背景,使得整體的網(wǎng)頁更加和諧自然。同時(shí),為了使所做的網(wǎng)頁更加充實(shí),我們還要在內(nèi)容上添加一些詩歌呀,文章等文字性的東西。色彩的搭配,文字的大小,以及所作網(wǎng)頁的大小,每一點(diǎn)都是十分重要的,所以只有在每一點(diǎn)都認(rèn)真的考慮衡量之后,最終做出的網(wǎng)頁才會(huì)很賞析悅目,獨(dú)具特色,并且很好的詮釋所作網(wǎng)頁的主題。
所以,多方面的衡量才能做出一份好的網(wǎng)頁,我們一定要多練習(xí)才能提高自己的網(wǎng)頁制作水平。
第五篇:網(wǎng)頁制作實(shí)驗(yàn)報(bào)告完成步驟
武漢大學(xué)計(jì)算中心2007年5月
《網(wǎng)頁與Web程序設(shè)計(jì)》實(shí)驗(yàn)報(bào)告
年級:2008級(必修)
學(xué)號:2008姓名:專業(yè):
一、實(shí)驗(yàn)題目
分析或參考給定的“網(wǎng)站設(shè)計(jì)實(shí)例”,設(shè)計(jì)一個(gè)自選題材的網(wǎng)站。
說明:
1.自行設(shè)計(jì)的網(wǎng)站可以只包含靜態(tài)網(wǎng)頁(.htm),也可以包含動(dòng)態(tài)網(wǎng)頁(.asp)。
2.站點(diǎn)至少要有三層結(jié)構(gòu),頁面數(shù)5頁左右;網(wǎng)頁要有落款、版權(quán)說明。網(wǎng)站大小不要超過10MB。
3.在網(wǎng)站制作過程中或完成后,填寫下面“
五、實(shí)驗(yàn)步驟”里的省略號部分。
二、實(shí)驗(yàn)?zāi)康暮鸵?/p>
通過以前各章的學(xué)習(xí)和實(shí)驗(yàn),同學(xué)們已經(jīng)了解和初步掌握一系列的網(wǎng)頁與Web程序設(shè)計(jì)技術(shù)。本實(shí)驗(yàn)?zāi)苁勾蠹覍W(wǎng)站設(shè)計(jì)的全過程,有一個(gè)更加完整的概念,熟練掌握網(wǎng)站設(shè)計(jì)工具“網(wǎng)頁設(shè)計(jì)三劍客”。具體要求如下:
1.自選題材,主題內(nèi)容要合法、健康、實(shí)用。網(wǎng)站主題突出、內(nèi)容豐富。
2.自己動(dòng)手獨(dú)立完成網(wǎng)站設(shè)計(jì)??梢越梃b和模仿某個(gè)網(wǎng)站進(jìn)行設(shè)計(jì)與制作,但不可以從網(wǎng)上下載網(wǎng)頁直接上交。
3.站點(diǎn)應(yīng)當(dāng)設(shè)計(jì)合理,結(jié)構(gòu)分明,管理有序,無多余文件和文件夾,大小合適。文件和文件夾存放位置要正確,首頁文件名應(yīng)該使用index.htm、index.asp、default.htm或default.asp。其他文件或文件名命名也要規(guī)范,不宜使用漢字或帶有空格的名稱。
4.網(wǎng)站風(fēng)格統(tǒng)一,設(shè)計(jì)適合于主題的LOGO(徽標(biāo)),或者標(biāo)題圖片及動(dòng)畫。各頁面設(shè)計(jì)合理、美觀,有創(chuàng)意。不要太花哨或太孩子氣,不要只是各種元素的隨意拼湊。圖片和動(dòng)畫選用要適合主題,不要在網(wǎng)頁中插入不相干的圖片,圖片保存格式和圖片大小要合適。要適用于各種顯示器的分辨率,不要太寬,否則在顯示器分辨率較小時(shí)會(huì)出現(xiàn)水平滾動(dòng)條。
5.各個(gè)頁面之間的鏈接要合理有效,路徑要正確(使用相對路徑)。要合理使用css樣式,不要在各個(gè)頁面中重復(fù)定義相同的css樣式;應(yīng)該將css樣式存放到css文件中,然后附加即鏈接到各頁中。代碼結(jié)構(gòu)清晰,無垃圾代碼。
三、實(shí)驗(yàn)方法
網(wǎng)站設(shè)計(jì)的一般過程或方法如下:
1.確定主題和收集資料
自行選定所要設(shè)計(jì)的網(wǎng)站主題和欄目,收集有關(guān)圖文、數(shù)據(jù)等資料,經(jīng)過分析,初步確定網(wǎng)站的基本功能、結(jié)構(gòu)或三級目錄。
2.規(guī)劃網(wǎng)站和新建站點(diǎn)
在需求分析的基礎(chǔ)上,畫出網(wǎng)站的樹型目錄結(jié)構(gòu)圖,從網(wǎng)站根文件夾,子文件夾到文件名。首頁文件名如index.htm,應(yīng)該放在網(wǎng)站根文件夾里。根據(jù)Windows的“管理工具”中是否已安裝IIS,用Dreamweaver 8,在C:Inetpubwwroot或者D:里,新建站點(diǎn),即根文件夾,子文件夾或文件名。隨時(shí)在U盤上做好備份。
3.制作素材和單個(gè)網(wǎng)頁
用“網(wǎng)頁設(shè)計(jì)三劍客”自行制作或者收集網(wǎng)站要使用的小圖片、動(dòng)畫、音頻或視頻,制作單個(gè)網(wǎng)頁文件及其鏈接,以及按需要建立數(shù)據(jù)庫。按照規(guī)劃,一一放在網(wǎng)站的相應(yīng)子文件夾里。
武漢大學(xué)計(jì)算中心2007年5月
4.制作首頁和建立鏈接
制作首頁,并且建立與下一級網(wǎng)頁的鏈接(若受網(wǎng)站大小限制且超過5頁,則可建立必要的空連接)。
5.調(diào)試運(yùn)行
可以邊設(shè)計(jì)邊調(diào)試,也可以邊調(diào)試邊修改前面的設(shè)計(jì)。然后,正式運(yùn)行和提交網(wǎng)站。
四、實(shí)驗(yàn)環(huán)境
微機(jī) + Windows操作系統(tǒng)(含IIS)+ Fireworks 8 + Flash 8 + Dreamweaver 8 + Access。
五、實(shí)驗(yàn)步驟
請?zhí)顚懢W(wǎng)站分析與設(shè)計(jì)的實(shí)驗(yàn)步驟。
(一)分析給定的“網(wǎng)站設(shè)計(jì)實(shí)例”
1.該網(wǎng)站的樹型目錄或站點(diǎn)結(jié)構(gòu)圖(如圖1):
……
圖1 實(shí)例網(wǎng)站的樹型目錄或站點(diǎn)結(jié)構(gòu)
2.在該網(wǎng)站首頁上“插入”大標(biāo)題圖片和動(dòng)畫文件的操作步驟:
……
3.在該網(wǎng)站設(shè)計(jì)中,運(yùn)用了哪些樣式設(shè)計(jì)技術(shù)如CSS等?舉例說明:
……
4.在該網(wǎng)站設(shè)計(jì)中,下一級網(wǎng)頁顯示的目標(biāo)(位置)一般設(shè)置為:……;數(shù)據(jù)庫(.mdb)文件為:……。
5.在該網(wǎng)站設(shè)計(jì)中,較好地運(yùn)用了如下網(wǎng)頁與Web程序設(shè)計(jì)技術(shù):
……
(二)設(shè)計(jì)自選題材網(wǎng)站的具體步驟
1.確定主題和收集資料
本網(wǎng)站的主題:……
欄目或三級目錄:……
2.規(guī)劃網(wǎng)站和新建站點(diǎn)
網(wǎng)站的樹型目錄或站點(diǎn)結(jié)構(gòu)圖如圖2:
……
圖2 自制網(wǎng)站的樹型目錄或站點(diǎn)結(jié)構(gòu)
3.制作素材和單個(gè)網(wǎng)頁(舉例說明典型的操作步驟)
(1)素材制作
……
(2)網(wǎng)頁制作
……
(3)建立數(shù)據(jù)庫
4.制作首頁和建立鏈接(舉例說明典型的操作步驟)
……
5.調(diào)試運(yùn)行
調(diào)試和運(yùn)行情況:……