版權(quán)說(shuō)明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡(jiǎn)介
學(xué)習(xí)目標(biāo)
能夠在標(biāo)題欄設(shè)置動(dòng)態(tài)效果能夠在狀態(tài)欄設(shè)置動(dòng)態(tài)效果能夠制作出“添加到收藏夾”的功能能夠在網(wǎng)頁(yè)中顯示獲取的系統(tǒng)時(shí)間和日期10.1.1案例制作：為網(wǎng)頁(yè)“詩(shī)詞新苑”制作動(dòng)態(tài)效果最終效果如圖所示。10.1.1案例制作：為網(wǎng)頁(yè)“詩(shī)詞新苑”制作動(dòng)態(tài)效果1）定義站點(diǎn)。新建文件夾“ShiciXinyuan”，將素材中所有的文件和文件夾拷貝到“ShiciXinyuan”文件夾。在DreamweaverCC2015中新建站點(diǎn)，站點(diǎn)名稱為“詩(shī)詞新苑”，站點(diǎn)文件夾定義為文件夾“ShiciXinyuan”。2）設(shè)置添加到收藏夾。假如本網(wǎng)站的網(wǎng)址為http://www.SCXY.com，打開(kāi)index.html文件，選擇文本“添加收藏”，切換到代碼視圖，將“添加收藏”前后輸入如下代碼。<ahref="javascript:window.external.AddFavorite('http://www.SCXY.com','詩(shī)詞新苑')">加入收藏</a>3）切換到設(shè)計(jì)視圖，“添加收藏”如圖所所示，“添加收藏”是一個(gè)超鏈接，可以使用偽錨記CSS規(guī)則美化。10.1.1案例制作：為網(wǎng)頁(yè)“詩(shī)詞新苑”制作動(dòng)態(tài)效果4）創(chuàng)建偽錨記CSS規(guī)則①添加a:link選擇器。在“屬性”窗格中將“Font-size”設(shè)置為“13px”；“Color”設(shè)置為“#FFFFFF”；“Text-decoration”設(shè)置為“none”。③添加a:visited選擇器。在“屬性”窗格中將“Font-size”設(shè)置為“13px”；“Color”設(shè)置為“#FFFFFF”；“Text-decoration”設(shè)置為“none”。④添加a:hover選擇器。在“屬性”窗格中將“Font-size”設(shè)置為“13px”；“Color”設(shè)置為“#F8FF00”；“Text-decoration”設(shè)置為“none”。⑤添加a:active選擇器。在“屬性”窗格中將“Font-size”設(shè)置為“13px”；“Color”設(shè)置為“#F8FF00”；“Text-decoration”設(shè)置為“underline”?！疤砑邮詹亍比鐖D所示。10.1.1案例制作：為網(wǎng)頁(yè)“詩(shī)詞新苑”制作動(dòng)態(tài)效果5）保存，預(yù)覽，點(diǎn)擊“添加收藏”，會(huì)打開(kāi)“添加收藏”對(duì)話框，點(diǎn)擊“確定”按鈕，可以將本網(wǎng)站添加到收藏夾。10.1.1案例制作：為網(wǎng)頁(yè)“詩(shī)詞新苑”制作動(dòng)態(tài)效果6）設(shè)置標(biāo)題欄動(dòng)態(tài)效果。切換到代碼視圖，將光標(biāo)定位在<head></head>標(biāo)簽之間，輸入如下代碼：<scriptlanguage="javascript">a="::::::::詩(shī)詞新苑歡迎您!::::::::"
functiontitle(){a=a+a.substring(0,1)a=a.substring(1,a.length)document.title=asetTimeout("title()",500)}title()</script>10.1.1案例制作：為網(wǎng)頁(yè)“詩(shī)詞新苑”制作動(dòng)態(tài)效果7）設(shè)置背景音樂(lè)。將光標(biāo)定位在<head></head>標(biāo)簽之間，輸入如下代碼：<bgsoundloop="-1"src="other/bgmusic.mp3"/>8）預(yù)覽，觀察效果，同時(shí)，可以聽(tīng)到背景音樂(lè)的聲音。到此本實(shí)例制作完畢。
1.什么是腳本腳本語(yǔ)言是一種在互聯(lián)網(wǎng)上廣為傳播、使用的特效程序語(yǔ)言，是一種不需要編譯的語(yǔ)言。網(wǎng)頁(yè)中常用的有JavaScript和VBScript兩種。JavaScript自身具有高效代碼和開(kāi)放性，基于客戶端瀏覽器，具有簡(jiǎn)單性、動(dòng)態(tài)性、跨平臺(tái)性、節(jié)省CGI的交互時(shí)間等特點(diǎn)，得到了廣泛應(yīng)用。
2.Script腳本的插入與應(yīng)用在<head>與</head>之間插入JavaScript腳本，JavaScript腳本要放在<scriptlanguage="jscript"></script>標(biāo)簽中間。例如案例制作中設(shè)置動(dòng)態(tài)狀態(tài)欄和背景音樂(lè)的腳本代碼的插入。10.1.2新知解析
3.常見(jiàn)的Script腳本腳本特效（１）添加到收藏夾代碼如下。
<a
href="javascript:window.external.addfavorite('','天鵝大觀')"class="STYLE1">添加到收藏夾</a>該代碼是將網(wǎng)址為“”、網(wǎng)頁(yè)的標(biāo)題為“天鵝大觀”的網(wǎng)站的首頁(yè)添加到收藏夾中。其中，STYLE1是網(wǎng)頁(yè)中創(chuàng)建的樣式。只要替換網(wǎng)址和標(biāo)題名稱即可。（2）標(biāo)題欄與狀態(tài)欄走馬燈效果將光標(biāo)定位在<head></head>標(biāo)簽之間，輸入代碼即可。標(biāo)題欄走馬燈效果的代碼如下：
<SCRIPTlanguage=JavaScript>
a="::::::::歡迎來(lái)到天鵝大觀網(wǎng)站!::::::::"
//為變量a賦值.。
functionbb()//定義函數(shù)bb（）
{
a=a+a.substring(0,1)
//將變量a與從變量a中取出的字符串相連，并賦給變量a，
//其中，a.substring(0,1)表示從變量a中取字符串，從第0個(gè)
//字符開(kāi)始取1個(gè)字符。
a=a.substring(1,a.length)//從字符串變量a中取字符串，從第1開(kāi)始取，共取a.length個(gè)，
//其中，a.length表示字符變量a的長(zhǎng)度。
document.title=a//將變量a賦給標(biāo)題欄變量。
setTimeout("bb()",500)
//每隔500毫秒刷新一次函數(shù)bb()。
}
bb()//調(diào)用函數(shù)bb()。
</script>（4）獲取顯示當(dāng)前系統(tǒng)時(shí)間和日期為了方便用戶查看當(dāng)前日期與時(shí)間，在狀態(tài)欄顯示當(dāng)前日期與時(shí)間，可以在網(wǎng)頁(yè)中<head></head>標(biāo)簽內(nèi)輸入如下代碼。
<SCRIPTlanguage=JavaScript>
<!--
functionshijian()//定義shijian()函數(shù)
{
today=newDate();//創(chuàng)建當(dāng)前日期對(duì)象today
varweek_day;//定義星期幾的變量
vardate;
//定義日期變量
if(today.getDay()==0)//判斷獲取星期的值，如果為0，則為week_day賦值“星期日”。
week_day="星期日"
if(today.getDay()==1)//如果為1，則為week_day賦值“星期一”。
week_day="星期一"
if(today.getDay()==2)//如果為2，則為week_day賦值“星期二”。
week_day="星期二"
if(today.getDay()==3)//如果為3，則為week_day賦值“星期三”。
week_day="星期三"
if(today.getDay()==4)//如果為4，則為week_day賦值“星期四”。
week_day="星期四"
if(today.getDay()==5)//如果為5，則為week_day賦值“星期五”。
week_day="星期五"if(today.getDay()==6)//如果為6，則為week_day賦值“星期六”。
week_day="星期六"
date=(today.getYear())+"年"+(today.getMonth()+1)+"月"+today.getDate()+"日";//getYear()獲取年份，getMonth()獲取月份，getDate()獲取日期
h=today.getHours()//getHours()獲取時(shí)；m=today.getMinutes()//getMinutes()獲取分；s=today.getSeconds()//getSeconds()獲取秒； if(h<=9)//如果時(shí)小于9，則小時(shí)前補(bǔ)0；h="0"+hif(m<=9)//如果分小于9，則分前補(bǔ)0；
m="0"+m
if(s<=9)//如果秒小于9，則秒前補(bǔ)0；
s="0"+s
time=h+":"+m+":"+s
//將變量h（時(shí)）的值、變量m（分）的值、s變量（秒）的值賦
//給變量time；
window.status="當(dāng)前時(shí)間："+date+week_day+""+time
//輸出日期與時(shí)間；
setTimeout("shijian()",1000)
}
shijian()//調(diào)用shijian()函數(shù)；
//-->
</SCRIPT>如果要在網(wǎng)頁(yè)中顯示時(shí)間可以將window.status="當(dāng)前時(shí)間："+date+week_day+""+time和setTimeout("shijian()",1000)這兩行代碼換為document.write("<spanclass='style1'>"+"當(dāng)前時(shí)間"+date+week_day+""+time+"</span>")，在相應(yīng)的位置輸入上述代碼即可。其中style1為網(wǎng)頁(yè)中創(chuàng)建的樣式。10.1.3實(shí)戰(zhàn)演練：為“玫瑰文化”網(wǎng)頁(yè)添加動(dòng)態(tài)效果最終效果如圖所示。10.1.3實(shí)戰(zhàn)演練：為“玫瑰文化”網(wǎng)頁(yè)添加動(dòng)態(tài)效果1）定義站點(diǎn)。新建文件夾“MeiGui”，將素材中所有的文件和文件夾拷貝到“MeiGui”文件夾。在DreamweaverCC2015中新建站點(diǎn)，站點(diǎn)名稱為“玫瑰文化”，站點(diǎn)文件夾定義為文件夾“MeiGui”。2）設(shè)置標(biāo)題欄動(dòng)態(tài)效果。將光標(biāo)定位在<head></head>標(biāo)簽之間，輸入如下代碼，保存，預(yù)覽。10.1.3實(shí)戰(zhàn)演練：為“玫瑰文化”網(wǎng)頁(yè)添加動(dòng)態(tài)效果<scriptlanguage="jscript">a="::::::::歡迎來(lái)到玫瑰文化網(wǎng)站首頁(yè)!::::::::"
functionbb(){a=a+a.substring(0,1)a=a.substring(1,a.length)document.title=asetTimeout("bb()",500)}bb()</script>10.1.3實(shí)戰(zhàn)演練：為“玫瑰文化”網(wǎng)頁(yè)添加動(dòng)態(tài)效果3）設(shè)置狀態(tài)欄動(dòng)態(tài)時(shí)間效果。將光標(biāo)定位在<head></head>標(biāo)簽之間，輸入代碼。保存，預(yù)覽。4）設(shè)置背景音樂(lè)。將光標(biāo)定位在<head></head>標(biāo)簽之間，輸入以下代碼，保存，預(yù)覽。<bgsoundloop="-1"src="others/bgsound.mp3"/>5）預(yù)覽效果，到此本實(shí)例制作完畢。學(xué)習(xí)目標(biāo)能夠使用文件面板管理站點(diǎn)能夠進(jìn)行文件的上傳與下載11.1站點(diǎn)的管理11.2站點(diǎn)測(cè)試11.3文件的上傳與下載本章內(nèi)容11.1站點(diǎn)的管理在定義站點(diǎn)時(shí)，站點(diǎn)設(shè)置對(duì)象包括站點(diǎn)、服務(wù)器、版本控制和高級(jí)設(shè)置。1.定義本地站點(diǎn)。單擊菜單命令“站點(diǎn)”→“新建站點(diǎn)”，在打開(kāi)的站點(diǎn)設(shè)置對(duì)象對(duì)話框中有4個(gè)選項(xiàng)，在“站點(diǎn)”選項(xiàng)下，可以設(shè)置本地站點(diǎn)的名稱和指定站點(diǎn)文件夾，如圖所示。11.1.1定義站點(diǎn)11.1站點(diǎn)的管理2.設(shè)置遠(yuǎn)程服務(wù)器當(dāng)本地站點(diǎn)制作完成、并進(jìn)行測(cè)試成功后，就需要將站點(diǎn)上傳到互聯(lián)網(wǎng)上的遠(yuǎn)程站點(diǎn)上。在上傳前，需要對(duì)遠(yuǎn)程站點(diǎn)進(jìn)行相應(yīng)的設(shè)置。這就需要在站點(diǎn)設(shè)置對(duì)象對(duì)話框中選擇“服務(wù)器”選項(xiàng)。可以單擊菜單命令“站點(diǎn)”→“管理站點(diǎn)”，在打開(kāi)的“管理站點(diǎn)”對(duì)話框中選擇要編輯的站點(diǎn)“極地動(dòng)物”，單擊編輯當(dāng)前選定的站點(diǎn)按鈕。11.1.1定義站點(diǎn)11.1站點(diǎn)的管理2.設(shè)置遠(yuǎn)程服務(wù)器在接下來(lái)打開(kāi)的站點(diǎn)設(shè)置對(duì)象對(duì)話框中選擇第2個(gè)選項(xiàng)“服務(wù)器”，單擊頁(yè)面左下角的加號(hào)按鈕，添加新服務(wù)器。11.1.1定義站點(diǎn)11.1站點(diǎn)的管理2.設(shè)置遠(yuǎn)程服務(wù)器對(duì)服務(wù)器的設(shè)置有“基本”和“高級(jí)”兩個(gè)部分?！盎尽痹O(shè)置主要是對(duì)服務(wù)器的名稱、連接方法等進(jìn)行設(shè)置。一般地，服務(wù)器默認(rèn)的連接方法為FTP連接。其他的連接方法還有SFTP、本地/網(wǎng)絡(luò)、WebDAV和RDS，如圖所示。如果需要進(jìn)一步設(shè)置，可以展開(kāi)“更多選項(xiàng)”欄進(jìn)行設(shè)置。在此選擇FTP，服務(wù)器名稱可以任意選取，在FTP地址欄中輸入申請(qǐng)空間的IP地址或域名，再輸入申請(qǐng)的用戶名和密碼，單擊“測(cè)試”按鈕，測(cè)試連接是否成功。若連接成功，則出現(xiàn)“Dreamweaver已成功連接到您的Web服務(wù)器”的對(duì)話框，單擊“確認(rèn)”按鈕即可完成設(shè)置。11.1.1定義站點(diǎn)11.1站點(diǎn)的管理2.設(shè)置遠(yuǎn)程服務(wù)器
11.1.1定義站點(diǎn)11.1站點(diǎn)的管理2.設(shè)置遠(yuǎn)程服務(wù)器“高級(jí)”設(shè)置是對(duì)遠(yuǎn)程服務(wù)器和測(cè)試服務(wù)器的服務(wù)器模型進(jìn)行設(shè)置，如圖所示。如果您在小組環(huán)境中工作（或獨(dú)自工作但使用幾臺(tái)不同的計(jì)算機(jī)），則選擇“啟用文件取出功能”，并設(shè)置取出名稱和電子郵件地址。如果希望對(duì)網(wǎng)站禁用文件存回和取出，請(qǐng)取消選擇此選項(xiàng)。11.1.1定義站點(diǎn)11.1站點(diǎn)的管理3.版本控制設(shè)置第3個(gè)選項(xiàng)為“版本控制”，用戶可以設(shè)置使用Subversion（SVN）獲取和存回文件。Subversion是一種版本控制系統(tǒng)，它使用戶能夠協(xié)作編輯和管理遠(yuǎn)程Web服務(wù)器上的文件。Dreamweaver不是一個(gè)完整的Subversion（SVN）客戶端，但卻可使用戶獲取文件的最新版本、更改和提交文件。11.1.1定義站點(diǎn)11.1站點(diǎn)的管理4.高級(jí)設(shè)置前面講解的站點(diǎn)設(shè)置是站點(diǎn)的基本設(shè)置，主要是針對(duì)初學(xué)者快速建立站點(diǎn)。高級(jí)設(shè)置可以對(duì)初步設(shè)置的站點(diǎn)進(jìn)行進(jìn)一步的細(xì)化設(shè)置。這個(gè)選項(xiàng)包含“本地信息”、“遮蓋”、“設(shè)計(jì)備注”、“文件視圖列”、“Contribute”、“模板”“jQuery”、“Web字體”、“EdgeAnimate資源”的設(shè)置。“本地信息”選項(xiàng)如圖所示。其余的幾個(gè)選項(xiàng)可根據(jù)用戶的需要進(jìn)行設(shè)置選定。11.1.1定義站點(diǎn)11.1站點(diǎn)的管理4.高級(jí)設(shè)置
11.1.1定義站點(diǎn)11.1站點(diǎn)的管理單擊菜單命令“站點(diǎn)”→“管理站點(diǎn)”，打開(kāi)“管理站點(diǎn)”對(duì)話框，如圖所示，可以對(duì)站點(diǎn)進(jìn)行新建、編輯、復(fù)制、刪除、導(dǎo)入、導(dǎo)出等操作。11.1.2管理站點(diǎn)11.1站點(diǎn)的管理1.“文件”面板單擊菜單命令“窗口”→“文件”，可以打開(kāi)“文件”面板。當(dāng)在DreamweaverCC中定義好一個(gè)站點(diǎn)后，“文件”面板中便列出了所定義的站點(diǎn)中包含的所有內(nèi)容。11.1.3利用“文件”面板管理文件11.1站點(diǎn)的管理2.“文件”面板實(shí)現(xiàn)的功能（1）打開(kāi)文件。在“文件”面板中雙擊文件圖標(biāo)，或右鍵單擊該文件，在彈出菜單中選擇“打開(kāi)”命令。（2）新建文件或文件夾。在“文件”面板中右鍵單擊空白處或單擊面板右上角的按鈕，在彈出菜單中選擇“新建文件”或“新建文件夾”命令。同樣，按照此操作方法，可以完成對(duì)站點(diǎn)文件的復(fù)制、刪除、重命名等操作。（3）切換站點(diǎn)。當(dāng)定義了多個(gè)站點(diǎn)后，當(dāng)要選擇某個(gè)站點(diǎn)為當(dāng)前站點(diǎn)時(shí)，可單擊“文件”面板第2行左側(cè)站點(diǎn)選擇列表進(jìn)行選擇。11.1.3利用“文件”面板管理文件11.1站點(diǎn)的管理2.“文件”面板實(shí)現(xiàn)的功能（4）刷新站點(diǎn)文件列表。在“文件”面板中單擊刷新按鈕，對(duì)站點(diǎn)列表進(jìn)行刷新。本操作是為了刷新遠(yuǎn)程目錄列表，以達(dá)到和遠(yuǎn)程目錄同步的目的。（5）檢查單個(gè)/多個(gè)網(wǎng)頁(yè)文件的鏈接或整個(gè)站點(diǎn)的鏈接。在“文件”面板“本地視圖”下，選取需要檢查鏈接的文件，單擊右鍵，在彈出的快捷菜單中選擇“檢查鏈接”→“選擇文件/文件夾”，進(jìn)行檢測(cè)，結(jié)果會(huì)顯示在“結(jié)果”窗口中，如圖所示。11.1.3利用“文件”面板管理文件11.1站點(diǎn)的管理2.“文件”面板實(shí)現(xiàn)的功能在“文件”面板中選擇站點(diǎn)，單擊右鍵，在彈出的快捷菜單中選擇“檢查鏈接”→“整個(gè)本地站點(diǎn)”命令，則對(duì)整個(gè)站點(diǎn)進(jìn)行鏈接檢測(cè)。在“鏈接檢查器”面板中，從“顯示”的下拉菜單中選擇“外部鏈接”或“孤立的文件”，如圖所示。若要保存檢查的報(bào)告，請(qǐng)單擊“鏈接檢查器”面板中的“保存報(bào)告”按鈕。11.1.3利用“文件”面板管理文件11.1站點(diǎn)的管理2.“文件”面板實(shí)現(xiàn)的功能（6）上傳和下載站點(diǎn)文件。DreamweaverCC中內(nèi)置了FTP功能，可以直接將本地站點(diǎn)內(nèi)的文件傳輸?shù)竭h(yuǎn)程服務(wù)器上（即上傳），或從服務(wù)器上獲取文件（即下載）。在“文件”面板中的站點(diǎn)下拉列表中選擇需要上傳的站點(diǎn)，單擊連接到遠(yuǎn)程服務(wù)器按鈕，建立與遠(yuǎn)程服務(wù)器的連接，然后選中要上傳的文件，單擊上傳按鈕，當(dāng)出現(xiàn)提示上傳任何從屬文件時(shí)單擊“確定”按鈕，即可上傳文件。下載文件和上傳文件步驟相似，但需要注意的是，在使用文件的上傳和下載功能之前，必須先定義遠(yuǎn)程服務(wù)器。11.1.3利用“文件”面板管理文件11.2站點(diǎn)測(cè)試當(dāng)一個(gè)站點(diǎn)制作完成后，在上傳之前，需要對(duì)站點(diǎn)進(jìn)行檢測(cè)，以便發(fā)現(xiàn)錯(cuò)誤并進(jìn)行修改。Dreamweaver能夠自動(dòng)檢測(cè)網(wǎng)站內(nèi)部的網(wǎng)頁(yè)文件，并生成關(guān)于文件信息、HTML代碼信息的報(bào)告。打開(kāi)站點(diǎn)中的任意一個(gè)頁(yè)面，單擊菜單命令“站點(diǎn)”→“報(bào)告”，彈出報(bào)告對(duì)話框，在“報(bào)告在”下拉列表中選擇“整個(gè)當(dāng)前本地站點(diǎn)”，在“選擇報(bào)告”的“HTML報(bào)告”項(xiàng)下勾選各復(fù)選框，單擊“運(yùn)行”按鈕，如圖所示。
Dreamweaver會(huì)對(duì)整個(gè)檢點(diǎn)進(jìn)行檢查，檢查完畢自動(dòng)打開(kāi)“站點(diǎn)報(bào)告”面板，顯示檢查結(jié)果11.2.1創(chuàng)建站點(diǎn)報(bào)告11.2站點(diǎn)測(cè)試
在DreamweaverCC中可以清理一些不必要的HTML語(yǔ)句，也可以清理由Word生成的HTML文件。1.清理不必要的HTML語(yǔ)句單擊菜單命令“命令”→“清理HTML命令”，在彈出的對(duì)話框中進(jìn)行設(shè)置，單擊“確定”按鈕，會(huì)彈出顯示清理結(jié)果的對(duì)話框。11.2.2清理文檔11.2站點(diǎn)測(cè)試（2）清理由Word生成的HTML文件單擊菜單命令“命令”→“清理Word生成的HTML”，在彈出的對(duì)話框的“基本”選項(xiàng)卡和“詳細(xì)”選項(xiàng)卡中進(jìn)行設(shè)置。11.2.2清理文檔11.2站點(diǎn)測(cè)試在“文件”面板中選擇站點(diǎn)，單擊右鍵，在彈出的快捷菜單中選擇“檢查鏈接”→“選擇文件/文件夾”或“整個(gè)本地站點(diǎn)”命令，則對(duì)整個(gè)站點(diǎn)進(jìn)行鏈接檢測(cè)。在“鏈接檢查器”面板中，從“顯示”的下拉菜單中選擇檢查的類型，檢查結(jié)果會(huì)顯示在“鏈接檢查器”面板中。11.2.3檢查網(wǎng)頁(yè)鏈接11.3文件的上傳與下載網(wǎng)站空間是指遠(yuǎn)程服務(wù)器中的用于存放網(wǎng)頁(yè)的硬盤(pán)空間。本案例將在“浦東信息港”網(wǎng)站上申請(qǐng)免費(fèi)網(wǎng)站空間。1）在瀏覽器地址欄中輸入網(wǎng)址“/”，進(jìn)入網(wǎng)站“浦東信息港”主頁(yè)。11.3.1案例制作：申請(qǐng)空間11.3文件的上傳與下載2）在網(wǎng)站的左上角的用戶登錄板塊單擊“注冊(cè)”按鈕進(jìn)行會(huì)員注冊(cè)。注冊(cè)成功后，會(huì)返回FTP密碼。接著以注冊(cè)的信息進(jìn)行登錄。11.3.1案例制作：申請(qǐng)空間11.3文件的上傳與下載3）單擊菜單“免費(fèi)空間”，在頁(yè)面中選擇“海外免費(fèi)免備案產(chǎn)品（200M）”產(chǎn)品，單擊“立即開(kāi)通”。11.3.1案例制作：申請(qǐng)空間11.3文件的上傳與下載4）在出現(xiàn)的虛擬主機(jī)申請(qǐng)單中輸入綁定域名、FTP密碼，勾選“我已閱讀并接受虛擬主機(jī)租用協(xié)議”，單擊“確認(rèn)申請(qǐng)”按鈕。11.3.1案例制作：申請(qǐng)空間11.3文件的上傳與下載5）接下來(lái)彈出一個(gè)提示窗口，提示進(jìn)入審核流程。當(dāng)審核成功后，網(wǎng)站會(huì)給注冊(cè)的郵箱發(fā)送一個(gè)業(yè)務(wù)開(kāi)通通知。11.3.1案例制作：申請(qǐng)空間11.3文件的上傳與下載6）輸入網(wǎng)址“/”，進(jìn)入“浦東信息港”主頁(yè)，以注冊(cè)的會(huì)員名登錄，進(jìn)入管理首頁(yè)-業(yè)務(wù)管理-免費(fèi)空間-控制面板-輸入驗(yàn)證碼-確認(rèn)登錄-進(jìn)入控制面板產(chǎn)品管理頁(yè)面，單擊“FTP信息”按鈕查看信息。11.3.1案例制作：申請(qǐng)空間11.3文件的上傳與下載1.網(wǎng)站空間的獲取獲取網(wǎng)站空間的方法一般有以下幾種。（1）申請(qǐng)免費(fèi)主頁(yè)空間現(xiàn)在國(guó)內(nèi)提供免費(fèi)主頁(yè)空間的網(wǎng)站越來(lái)越少，容量卻有限。（2）付費(fèi)空間付費(fèi)空間有以下幾種形式：。1）主機(jī)托管2）主機(jī)租用3）虛擬主機(jī)11.3.2新知解析11.3文件的上傳與下載2.域名申請(qǐng)域名是一種Internet用于解決地址對(duì)應(yīng)問(wèn)題的一種方法。域名的形式是以若干英文字母和數(shù)字組成，由“.”分隔成幾個(gè)部分。目前國(guó)內(nèi)域名注冊(cè)統(tǒng)一由中國(guó)互聯(lián)網(wǎng)絡(luò)信息中心（CNNIC）進(jìn)行管理，具體注冊(cè)工作通過(guò)CNNIC論證授權(quán)的各代理商執(zhí)行。要申請(qǐng)一個(gè)與自己網(wǎng)站相符的域名，需向域名代理機(jī)構(gòu)提出申請(qǐng)。一些提供免費(fèi)主頁(yè)空間的網(wǎng)站，在你申請(qǐng)免費(fèi)網(wǎng)頁(yè)空間時(shí)會(huì)免費(fèi)提供一個(gè)域名。11.3.2新知解析11.3文件的上傳與下載3.上傳/下載文件一般可以利用提供免費(fèi)空間的站點(diǎn)的“網(wǎng)站空間管理”面板來(lái)完成，也可以利用Dreamweaver提供的上傳/下載功能來(lái)完成。11.3.2新知解析11.3文件的上傳與下載（1）遠(yuǎn)程站點(diǎn)的設(shè)置在DreamweaverCC中，單擊菜單命令“站點(diǎn)”→“管理站點(diǎn)”，在彈出的對(duì)話框中選擇要上傳的站點(diǎn)“極地動(dòng)物”,單擊編輯當(dāng)前選定的站點(diǎn)按鈕，進(jìn)入站點(diǎn)設(shè)置對(duì)象對(duì)話框，單擊“服務(wù)器”選項(xiàng)，在左下部單擊添加新服務(wù)器按鈕進(jìn)行相應(yīng)的設(shè)置。11.3.3實(shí)戰(zhàn)演練：上傳下載網(wǎng)站11.3文件的上傳與下載（1）單擊“測(cè)試”按鈕，若測(cè)試成功的話，出現(xiàn)如圖11-25所示的對(duì)話框，單擊“確定”按鈕。接著單擊“保存”按鈕就完成了遠(yuǎn)程服務(wù)器的設(shè)定，可以進(jìn)行網(wǎng)頁(yè)上傳了。11.3.3實(shí)戰(zhàn)演練：上傳下載網(wǎng)站11.3文件的上傳與下載（2）網(wǎng)頁(yè)上傳回到“文件”面板，單擊“展開(kāi)以顯示本地和遠(yuǎn)端站點(diǎn)”按鈕展開(kāi)“文件”面板，單擊遠(yuǎn)程連接圖標(biāo)就開(kāi)始自動(dòng)連接遠(yuǎn)程主機(jī)。如果連接成功，“文件”面板將在左邊欄目中列出遠(yuǎn)程站點(diǎn)的所有文件和文件夾，如圖所示。11.3.3實(shí)戰(zhàn)演練：上傳下載網(wǎng)站11.3文件的上傳與下載（2）在“文件”面板中選擇要上傳的文件，單擊按鈕，文件即可上傳，上傳的過(guò)程中會(huì)出現(xiàn)進(jìn)度提示，如圖所示。11.3.3實(shí)戰(zhàn)演練：上傳下載網(wǎng)站11.3文件的上傳與下載（2）當(dāng)所有內(nèi)容都放到遠(yuǎn)程空間后，左側(cè)的遠(yuǎn)程服務(wù)器端顯示站點(diǎn)內(nèi)容。所有的內(nèi)容放在wwwroot根目錄下。11.3.3實(shí)戰(zhàn)演練：上傳下載網(wǎng)站11.3文件的上傳與下載（3）服務(wù)器端查看站點(diǎn)效果在瀏覽器地址欄中輸入“82/wwwroot/”，按回車鍵，頁(yè)面如圖所示。雙擊文件“index.html”，瀏覽者就能通過(guò)瀏覽器觀看遠(yuǎn)程服務(wù)器端的網(wǎng)站效果了。（4）在文件面板上單擊下載按鈕，遠(yuǎn)程站點(diǎn)的文件即可下載到本地站點(diǎn)。還可以選中站點(diǎn)，單擊按鈕與遠(yuǎn)程服務(wù)器進(jìn)行同步。11.3.3實(shí)戰(zhàn)演練：上傳下載網(wǎng)站學(xué)習(xí)目標(biāo)了解如何規(guī)劃網(wǎng)站、組織素材及制作網(wǎng)站的流程掌握網(wǎng)站布局的方法和實(shí)用技巧掌握如何在網(wǎng)頁(yè)中添加動(dòng)態(tài)特效代碼12.1案例制作：網(wǎng)站“蝴蝶谷”12.2案例制作：網(wǎng)站“葆偉汽車”本章內(nèi)容12.1案例制作：網(wǎng)站“蝴蝶谷”最終效果如圖所示。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”最終效果如圖所示。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（1）準(zhǔn)備素材當(dāng)我們制作一個(gè)主題網(wǎng)站時(shí)，第1步是收集相關(guān)的圖片與文字，同時(shí)還要對(duì)網(wǎng)站的制作形式和色彩進(jìn)行構(gòu)思，根據(jù)需求確定網(wǎng)站的布局模式、色調(diào)和組成版塊，重點(diǎn)是對(duì)首頁(yè)進(jìn)行規(guī)劃。網(wǎng)頁(yè)的布局結(jié)構(gòu)可以借鑒一些比較優(yōu)秀的網(wǎng)站。第2步就是合成素材。一般我們收集的素材往往滿足不了我們的需求，尤其要制作有藝術(shù)感的網(wǎng)站。這時(shí)就需要借助圖形圖像處理軟件Photoshop進(jìn)行素材的合成和色調(diào)處理，并保存為jpg或gif格式文件。還需借助動(dòng)畫(huà)制作軟件Flash制作一些小的動(dòng)畫(huà)，并生成“.swf”格式文件。無(wú)論是合成圖像還是Flash動(dòng)畫(huà)，它們的制作尺寸都是根據(jù)網(wǎng)頁(yè)的布局尺寸確定的。在本網(wǎng)站中，需要應(yīng)用Photoshop合成頭部的背景圖片、導(dǎo)航菜單圖片、兩個(gè)欄目的背景圖片、歡迎介紹圖片及各欄目頭圖片。用Flash制作網(wǎng)頁(yè)頭部動(dòng)畫(huà)和蝴蝶宣傳動(dòng)畫(huà)。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（2）規(guī)劃站點(diǎn)新建文件夾hudie,在文件夾中新建image、file、other三個(gè)子文件夾。image文件夾將放置所有圖片素材，站點(diǎn)中除主頁(yè)以外的所有網(wǎng)頁(yè)文件將放置在file文件夾中，其他所有的素材將放置在other文件夾中。將站點(diǎn)中的圖片素材拷貝到image文件夾中，將Flash素材拷貝到other文件夾中。（3）定義站點(diǎn)啟動(dòng)DreamweaverCC，單擊菜單命令“站點(diǎn)”→“新建站點(diǎn)”，通過(guò)“站點(diǎn)設(shè)置對(duì)象”對(duì)話框定義站點(diǎn)名稱為“hudie”，將文件夾hudie定義為存放當(dāng)前站點(diǎn)的文件夾。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分1）新建網(wǎng)頁(yè)，在站點(diǎn)的根目錄下保存為index.html，將網(wǎng)頁(yè)的標(biāo)題改為“蝴蝶谷”。單擊屬性面板上的“頁(yè)面設(shè)置”按鈕，在“外觀（CSS）”選項(xiàng)下設(shè)頁(yè)面字體大小為12，“上邊距”為0。在“鏈接（CSS）”選項(xiàng)下設(shè)“鏈接顏色”和“已訪問(wèn)鏈接”的顏色為#666666，“變換圖像鏈接”顏色為#4ec100，“活動(dòng)鏈接”顏色設(shè)為紅色，單擊“確定”按鈕。這樣對(duì)頁(yè)面文字大小、超鏈接文字的大小及鏈接顯示狀態(tài)進(jìn)行了設(shè)置。2）單擊菜單命令“插入”→“表格”新建表格，在彈出的對(duì)話框中設(shè)定表格為3行1列，寬770像素，其余參數(shù)為0，單擊“確定”按鈕。選中表格，在屬性面板中設(shè)定表格的“Align”為居中對(duì)齊，這樣表格將在頁(yè)面中居中對(duì)齊。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分3)光標(biāo)移到第1行的單元格里，在文檔窗口右側(cè)的“CSS設(shè)計(jì)器”面板單擊“源”窗格右側(cè)的按鈕，在彈出的菜單中選擇“在頁(yè)面中定義”，在“源”窗格中生成<style>標(biāo)簽，表示創(chuàng)建源成功。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分3)選中在“源”窗格中創(chuàng)建的<style>標(biāo)簽，在“選擇器”窗格的右側(cè)單擊按鈕，設(shè)置新的選擇器名稱為“.bj1”。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分5）在CSS屬性面板中設(shè)“目標(biāo)規(guī)則”為“.bj1”，單擊“編輯規(guī)則”按鈕，打開(kāi)“.bj1的CSS規(guī)則定義”對(duì)話框，在彈出的對(duì)話框中選擇左側(cè)的“背景”選項(xiàng)，設(shè)背景圖像Background-image為image/tou.jpg，如圖所示，單擊“確定”按鈕。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分5）設(shè)單元格“寬”為770，“高”為140。屬性面板和表格如圖所示。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分6)光標(biāo)在第1行單元格中。單擊菜單命令“插入”→“媒體”→“FlashSWF”，打開(kāi)“選擇文件”對(duì)話框，找到image/mu.swf，單擊“確定”按鈕，于是在單元格中插入Flash的SWF文件。選中SWF文件，在屬性面板中單擊Wmode的下拉列表選擇“透明”，屬性面板如圖所示。按F12預(yù)覽Flash背景是否透明。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分7）光標(biāo)移到第2行單元格中，插入圖像文件image/caidan.jpg。選中圖像，在屬性面板上選擇矩形熱點(diǎn)工具，分別在菜單圖像上繪制矩形熱點(diǎn)區(qū)域，如圖所示。系統(tǒng)自動(dòng)為熱區(qū)建立空鏈接。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分8）光標(biāo)移到第3行單元格中，在CSS屬性面板中，設(shè)單元格寬度為770，高度為20、背景顏色為#4ec100。在CSS屬性面板中單擊拆分單元格按鈕，將單元格拆分為2列。光標(biāo)移到左側(cè)單元格中，輸入文字“當(dāng)前位置：首頁(yè)”，在右側(cè)單元格輸入文字“歡迎瀏覽本網(wǎng)站?。?！”。鼠標(biāo)拖動(dòng)2列單元格之間的邊框向左移動(dòng)，使得右側(cè)單元格大一些。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分9）選中右側(cè)文字，切換到代碼視圖，找到反白顯示的文字，添加跑馬燈效果代碼，當(dāng)鼠標(biāo)移到滾動(dòng)的文字上時(shí)文字停下不動(dòng)，鼠標(biāo)離開(kāi)文字后文字繼續(xù)滾動(dòng)。修改后的代碼為“<marqueeonmousemove=“this.stop()”onmouseout=“this.start()”>歡迎光臨本網(wǎng)站?。?！</marquee>”。按F12在瀏覽器中觀察文字滾動(dòng)效果。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分10）此時(shí)會(huì)發(fā)現(xiàn)滾動(dòng)文字所在的綠色背景單元格與上一行菜單之間閃了一條縫隙，沒(méi)有完全連接在一起。這是由于瀏覽器兼容性問(wèn)題造成的。切換到代碼視圖，將光標(biāo)移到第一行，將代碼<!doctypehtml>改為<!doctypehtmlpublic>，如圖所示。再按F12在瀏覽器中觀察效果，會(huì)發(fā)現(xiàn)閃縫沒(méi)有了。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分11）在CSS選擇器中選中“源”窗格中的<style>標(biāo)簽，在“選擇器”窗格的右側(cè)單擊按鈕，設(shè)置新的選擇器名稱為“.t1”。選中左側(cè)單元格中的文字，在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.t1”，單擊“編輯規(guī)則”按鈕，在彈出的“.t1的CSS規(guī)則定義”對(duì)話框中，在“類型”選項(xiàng)下設(shè)字體顏色Color為白色。此時(shí)左側(cè)單元格文字顏色變?yōu)榘咨?2.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（4）制作網(wǎng)頁(yè)頁(yè)眉部分11）選中右側(cè)單元格中的文字，在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.t1”，則右側(cè)單元格文字顏色變?yōu)榘咨?。按F12觀察效果。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分1）鼠標(biāo)單擊表格右側(cè)外部的空白區(qū)域，將光標(biāo)移到表格的右側(cè)，單擊菜單命令“插入”→“表格”，新建一個(gè)新的2行2列表格，設(shè)表格寬為770，其他為0。在屬性面板中設(shè)表格的“Align”為居中對(duì)齊。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分2）框選所有單元格，在屬性面板中設(shè)單元格的“垂直”對(duì)齊方式為“頂端”。3）將光標(biāo)移到第1行左側(cè)單元格中，在CSS選擇器中選中“源”窗格中的<style>標(biāo)簽，在“選擇器”窗格的右側(cè)單擊按鈕，設(shè)置新的選擇器名稱為“.b1”。在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.b1”，單擊“編輯規(guī)則”按鈕，在彈出的“.b1的CSS規(guī)則定義”對(duì)話框中，在“背景”選項(xiàng)下設(shè)背景圖像Background-image為“image/left.jpg”，背景重復(fù)Background-repeat選擇“No-repeat”。在“方框”選項(xiàng)下設(shè)寬Width為460，高Height為170，單擊“確定”按鈕。于是左側(cè)單元格應(yīng)用了CSS樣式“.b1”。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分4）將光標(biāo)移到第2行左側(cè)單元格中，在CSS選擇器中選中“源”窗格中的<style>標(biāo)簽，在“選擇器”窗格的右側(cè)單擊按鈕，設(shè)置新的選擇器名稱為“.b2”。在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.b2”，單擊“編輯規(guī)則”按鈕，在彈出的“.b2的CSS規(guī)則定義”對(duì)話框中，在“背景”選項(xiàng)下設(shè)背景圖像為““image/right.jpg””，背景重復(fù)Background-repeat選擇“No-repeat”。在“方框”選項(xiàng)下設(shè)寬Width為460，高Height為170，單擊“確定”按鈕。于是左側(cè)單元格應(yīng)用了CSS樣式“.b2”。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分4）12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分5）光標(biāo)移到第1行左側(cè)單元格內(nèi)，插入一個(gè)5行7列、寬為100%、其他為0的嵌套表格。選中所有單元格，設(shè)“水平”和“垂直”對(duì)齊方式為“居中”。在第2行的第2、4、6單元格中分別插入如圖所示的圖像。光標(biāo)分別移到插入圖像的單元格中，在屬性面板中設(shè)單元格的“寬”為27%，“高”為95。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分6）在第3、4行的對(duì)應(yīng)單元格中輸入如圖12-18所示的文字。在CSS選擇器中選中“源”窗格中的<style>標(biāo)簽，在“選擇器”窗格的右側(cè)單擊按鈕，設(shè)置新的選擇器名稱為“.t2”。選中一個(gè)單元格中輸入的文字，在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.t2”，單擊“編輯規(guī)則”按鈕，在彈出的“.t2的CSS規(guī)則定義”對(duì)話框中，在“類型”選項(xiàng)下設(shè)字號(hào)Font-size為12、字體顏色Color為#666666，單擊“確定”按鈕。則文字變?yōu)榛疑Ｔ俜謩e選中其他單元格中的文字，在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.t2”。框選文字單元格，在屬性面板中設(shè)單元格的“高”為18。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分6）在第3、4行的對(duì)應(yīng)單元格中輸入如圖所示的文字。在CSS選擇器中選中“源”窗格中的<style>標(biāo)簽，在“選擇器”窗格的右側(cè)單擊按鈕，設(shè)置新的選擇器名稱為“.t2”。選中一個(gè)單元格中輸入的文字，在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.t2”，單擊“編輯規(guī)則”按鈕，在彈出的“.t2的CSS規(guī)則定義”對(duì)話框中，在“類型”選項(xiàng)下設(shè)字號(hào)Font-size為12、字體顏色Color為#666666，單擊“確定”按鈕。則文字變?yōu)榛疑?。再分別選中其他單元格中的文字，在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.t2”?？蜻x文字單元格，在屬性面板中設(shè)單元格的“高”為18。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分6）12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分7）在第5行中合并第6、7個(gè)單元格，并輸入文字“更多>>”。選中文字，在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.t2”，設(shè)單元格“水平”為“右對(duì)齊”，“垂直”為“底部”。其效果如圖所示。若左側(cè)的背景圖片的欄目名稱被覆蓋遮擋的話，可以向右拖動(dòng)第1個(gè)單元右側(cè)的邊線，使得欄目名稱不被遮擋。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分8）光標(biāo)移到第2行左側(cè)單元格內(nèi)，插入6行7列、寬為100%的嵌套表格。按照?qǐng)D所示布局進(jìn)行單元格合并，并拖動(dòng)單元格邊框改變單元格的寬度。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分9）在相應(yīng)的單元格中插入圖片和文字，文字前面的黑點(diǎn)，是通過(guò)“插入”→“HTML”→“特殊字符”→“其他字符”→找到黑點(diǎn)符號(hào)來(lái)實(shí)現(xiàn)的。分別選中文字應(yīng)用“.t2”樣式。最后1行的單元格設(shè)“垂直”對(duì)齊方式為“右對(duì)齊”。設(shè)每行單元格高度為18。根據(jù)布局美觀要求，可適當(dāng)調(diào)整各單元格的寬度。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分10）將光標(biāo)移到大表格第1行右側(cè)的單元格中，設(shè)單元格的“水平”和“垂直”的對(duì)齊方式為“居中”。插入圖像image/YOUTU1.jpg。11）將光標(biāo)移到大表格第2行右側(cè)的單元格中，設(shè)單元格的“垂直”的對(duì)齊方式為“頂端”。插入一個(gè)7行3列、寬為100%的嵌套表格。分別在其中輸入如圖12-22所示的文字。設(shè)每行單元格的“高”為20。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（5）制作正文部分12）在CSS選擇器中選中“源”窗格中的<style>標(biāo)簽，在“選擇器”窗格的右側(cè)單擊按鈕，設(shè)置新的選擇器名稱為“.t3”。選中第1行的英文，在CSS屬性面板中的“目標(biāo)規(guī)則”下拉列表中選擇“.t3”，單擊“編輯規(guī)則”按鈕，在彈出的“.t3的CSS規(guī)則定義”對(duì)話框中，在“類型”選項(xiàng)下設(shè)字號(hào)Font-size為14、字體顏色Color為#c00，單擊“確定”按鈕。選中其他的文字，應(yīng)用CSS樣式“.t2”。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（6）版權(quán)區(qū)域制作1）鼠標(biāo)單擊表格右側(cè)外部的空白區(qū)域，將光標(biāo)移到表格的右側(cè)，插入一個(gè)新的3行1列表格，設(shè)表格寬為770，其他為0。在屬性面板中設(shè)表格的“Align”為居中對(duì)齊。2）光標(biāo)移到第1行單元格中，在CSS屬性面板中，設(shè)“寬”為770，“高”為20、背景顏色為#4ec100。輸入文字“ILOVEBUTTERFLY”，選中文字，在屬性面板中的“目標(biāo)規(guī)則”中應(yīng)用“.t1”樣式，文字顏色為白色。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（6）版權(quán)區(qū)域制作2）光標(biāo)移到第2行單元格中，插入水平線，選中水平線，在屬性面板中設(shè)高度為2，切換到代碼視圖，找到反白顯示的水平線代碼，修改代碼為“<hrsize="2"color="#A2C012"/>”，則水平線改為淺綠色。3）在第3行單元格中輸入版權(quán)文字，并設(shè)置電子郵件鏈接和更新日期，在屬性面板中設(shè)單元格的“水平”對(duì)齊方式為“居中對(duì)齊”。選中文字，應(yīng)用“.t2”樣式。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（7）網(wǎng)站子頁(yè)的制作1）將網(wǎng)頁(yè)index.html另存為gushi.html,保存到file文件夾下。將網(wǎng)頁(yè)正文部分左、右兩側(cè)的嵌套表格和圖像刪除掉。分別選中左側(cè)的上下兩個(gè)單元格，在屬性面板的“目標(biāo)規(guī)則”中選擇“刪除類”，去掉單元格背景。選中正文部分的表格，在屬性面板中修改為1行2列。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（7）網(wǎng)站子頁(yè)的制作2）光標(biāo)移到正文部分表格的左側(cè)單元格內(nèi)，在屬性面板中設(shè)單元格的“寬”為205、背景顏色為#eeeeee、“垂直”對(duì)齊方式為“頂部”。3）插入一個(gè)8行3列、寬為100%、其他為0的嵌套表格。將第1行的3個(gè)單元格進(jìn)行合并，插入圖像image/futou.jpg。光標(biāo)移到第3行第2個(gè)單元格中，設(shè)單元格的“水平”和“垂直”對(duì)齊方式為“居中”。插入Flash文件other/fumu.swf。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（7）網(wǎng)站子頁(yè)的制作3）光標(biāo)移到第5行的中間單元格中，輸入文字“內(nèi)容提要：”，并應(yīng)用“.t2”樣式。光標(biāo)移到第6行的中間單元格中，單擊菜單命令“插入”→“HTML”→“特殊字符”→“其他字符”→單擊黑點(diǎn)符號(hào)，再輸入文字“我的蝴蝶說(shuō)”。選中文字。應(yīng)用樣式“.t2”。選中小黑點(diǎn)，在屬性面板的“目標(biāo)規(guī)則”中應(yīng)用t3樣式。拖動(dòng)單元格的邊線調(diào)整單元格的高度，其布局效果如圖所示。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（7）網(wǎng)站子頁(yè)的制作3）將光標(biāo)移到右側(cè)的單元格中，設(shè)單元格的“垂直”對(duì)齊方式為“頂端”。插入一個(gè)5行3列、寬為100%、其他為0的嵌套表格，在第2行第2個(gè)單元格中插入圖像image/gushi.jpg。將光標(biāo)移到第4行第2個(gè)單元格中，設(shè)單元格的“水平”對(duì)齊方式為“居中對(duì)齊”，“垂直”對(duì)齊方式為“頂端”。插入一個(gè)1行1列、寬為80%的嵌套表格，在其中輸入文字。選中第1行文字，在CSS屬性面板的“目標(biāo)規(guī)則”中應(yīng)用“.t3”樣式。其他文字應(yīng)用“.t2”樣式。其布局效果如圖所示。12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（7）網(wǎng)站子頁(yè)的制作3）12.1案例制作：網(wǎng)站“蝴蝶谷”12.1案例制作：網(wǎng)站“蝴蝶谷”（7）網(wǎng)站子頁(yè)的制作4）將頭部區(qū)域文字“當(dāng)前位置：首頁(yè)”修改為“當(dāng)前位置：蝴蝶故事”。5）在網(wǎng)頁(yè)index.html中，選中導(dǎo)航部分的“蝴蝶故事”熱點(diǎn)區(qū)域，在屬性面板的“鏈接”文本框中輸入file/gushi.html。在網(wǎng)頁(yè)gushi.html中，選中導(dǎo)航部分的“首頁(yè)”熱點(diǎn)區(qū)域，在屬性面板的“鏈接”文本框中輸入../index.html。則建立了網(wǎng)頁(yè)間的鏈接。12.1案例制作：網(wǎng)站“蝴蝶谷”12.2案例制作：網(wǎng)站“葆偉汽車”最終效果如圖所示12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（1）規(guī)劃站點(diǎn)新建文件夾“BaoweiQiche”，將素材文件夾“BaoweiQiche”中的“images”和“others”文件夾拷貝到“BaoweiQiche”文件夾中。（2）定義站點(diǎn)在DreamweaverCC2015中，單擊菜單“站點(diǎn)”→“新建站點(diǎn)”命令，通過(guò)“站點(diǎn)設(shè)置對(duì)象”對(duì)話框定義站點(diǎn)，站點(diǎn)名稱為“葆偉汽車”，本地站點(diǎn)文件夾設(shè)置為“BaoweiQiche”文件夾。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分1）新建網(wǎng)頁(yè)“index.html”，保存到站點(diǎn)文件夾下，打開(kāi)網(wǎng)頁(yè)“index.html”，將網(wǎng)頁(yè)的標(biāo)題改為“葆偉汽車首頁(yè)”，切換到代碼視圖，將第一行代碼<!doctypehtml>改為<!doctypehtmlpublic>。2）打開(kāi)“CSS設(shè)計(jì)器”面板，在“源”窗格中創(chuàng)建新的CSS文件，文件名為“cssfile.css”，將文件保存“others”文件夾，并以“鏈接”附加。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分3）創(chuàng)建一個(gè)*標(biāo)簽選擇器規(guī)則。在“選擇器”窗格中添加選擇器“*”，并選中，將“屬性”窗格切換到布局屬性，設(shè)置“margin”的值為0px，“padding”的值為0px，如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分3）將“屬性”窗格切換到布局屬性，設(shè)置“margin”的值為0px，“padding”的值為0px，如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分4）將“屬性”窗格切換到邊框?qū)傩?，設(shè)置“border”的值為0px。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分5）打開(kāi)“插入”面板，插入Div，在“插入”項(xiàng)中選擇“在插入點(diǎn)”，在ID中輸入“Box”，如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分6）點(diǎn)擊“新建CSS規(guī)則”按鈕，打開(kāi)“新建CSS規(guī)則”對(duì)話框，“選擇器類型”選擇“ID”，“選擇器名稱”設(shè)置為“#Box”，“規(guī)則定義”選擇“cssfile.css”。7）點(diǎn)擊“確定”按鈕，打開(kāi)“#Box的CSS規(guī)則定義”對(duì)話框。在“分類”中選擇“方框”項(xiàng)，設(shè)置“Width”為1004px，設(shè)置“Height”為615px，取消“Margin”中的“全部相同”的對(duì)勾，設(shè)置“Top”為0、“Right”為auto，“Bottom”為0，“Left”為auto，如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分7）12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分8）點(diǎn)擊“確定”按鈕，返回“插入Div”對(duì)話框，再次點(diǎn)擊“確定”按鈕，在頁(yè)面中插入ID為“Box”的Div，且Div居中顯示。9）將Div中默認(rèn)的文字刪除，插入Div標(biāo)簽，設(shè)置如圖所示，在“插入”項(xiàng)中選擇“在標(biāo)簽開(kāi)始之后”、“<divid=’Box’>”，在ID中輸入“Top”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分10）為ID為“Top”的Div創(chuàng)建ID選擇器規(guī)則，在“方框”中設(shè)置“Width”為1004px、“Height”為106px，在“背景”中設(shè)置“Background-image”為“Top_bg.jpg”，ID為“Top”的Div在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分11）將默認(rèn)的文字刪除，插入Div標(biāo)簽，設(shè)置如圖所示，在“插入”項(xiàng)中選擇“在標(biāo)簽開(kāi)始之后”、“<divid=’Top’>”，在ID中輸入“Flash”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分12）為ID為“Flash”的Div創(chuàng)建ID選擇器規(guī)則，在“方框”中設(shè)置“Width”為270px、“Height”為106px，“Float”為left。13）將默認(rèn)的文字刪除，將光標(biāo)定位在ID為“Flash”的Div中，插入FlashSWF文件“xing.swf”，選中FlashSWF文件，將“寬”和“高”都設(shè)置為106px，“Wmode”設(shè)置為“透明”，保存，預(yù)覽，F(xiàn)lashSWF文件在瀏覽器中效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分14）插入Div標(biāo)簽，設(shè)置如圖所示，在“插入”項(xiàng)中選擇“在標(biāo)簽后”、“<divid=’Flash’>”，在ID中輸入“Contact-Nav”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分15）為ID為“Contact-Nav”的Div創(chuàng)建ID選擇器規(guī)則，在“方框”中設(shè)置“Width”為734px、“Height”為106px，“Float”為left。16）將默認(rèn)的文字刪除，插入Div標(biāo)簽，設(shè)置如圖所示，在“插入”項(xiàng)中選擇“在標(biāo)簽開(kāi)始之后”、“<divid=’Contact-Nav’>”，在ID中輸入“Contact-us”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分17）為ID為“Contact-us”的Div創(chuàng)建ID選擇器規(guī)則，并在“方框”中設(shè)置“Width”為633px、“Height”為26px，取消“Padding”中的“全部相同”的對(duì)勾，設(shè)置“Top”為40px，取消“Margin”中的“全部相同”的對(duì)勾，設(shè)置“Right”為101px。18）在“類型”中設(shè)置“Font-family”為“微軟雅黑”、“Font-size”為9px、“Font-weight”為“bold”、“Color”為“#838282”。在“分類”中選擇“區(qū)塊”項(xiàng)，設(shè)置“Text-align”為“right”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（3）制作Banner部分19）將默認(rèn)的文字刪除，輸入文字“HOME
|
CONTACT
|
MAILTOUS”，“HOME”文字部分在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（4）制作導(dǎo)航部分1）插入一個(gè)Div，設(shè)置如圖12-41所示，在“插入”項(xiàng)中選擇“在標(biāo)簽后”、“<divid=’Contact-us’>”，在“ID”中輸入“Nav”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（4）制作導(dǎo)航部分2）為ID為“Nav”的Div創(chuàng)建ID選擇器規(guī)則，在“方框”中設(shè)置“Width”為633px、“Height”為40px，取消“Margin”中的“全部相同”的對(duì)勾，設(shè)置“Right”為101px。3）在“類型”中設(shè)置“Font-family”為“宋體”、“Font-size”為13px、“Color”為“#DDDDDD”。4）在“分類”中選擇“區(qū)塊”項(xiàng)，設(shè)置“Text-align”為“right”。在“分類”中選擇“背景”項(xiàng)，設(shè)置“Background-color”為“#000000”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（4）制作導(dǎo)航部分5）將默認(rèn)的文字刪除，輸入文字素材中的對(duì)應(yīng)導(dǎo)航文字，為每條“|”左右各插入1個(gè)全角空格，為每個(gè)導(dǎo)航項(xiàng)設(shè)置空超鏈接，設(shè)置空鏈接后的導(dǎo)航部分在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（4）制作導(dǎo)航部分6）在“選擇器”窗格中添加偽錨記選擇器“a.nav:link”，在“屬性”窗格中，設(shè)置“font-family”為宋體、“font-size”為13px、“color”為#CCCCCC、“l(fā)ine-height”為40px、“font-weight”為“bold”、“text-decoration”為“none”。7）在“選擇器”窗格中添加偽錨記選擇器“a.nav:visited”，在“屬性”窗格中，設(shè)置“font-family”為宋體、“font-size”為13px、“color”為#CCCCCC、“l(fā)ine-height”為40px、“font-weight”為“bold”、“text-decoration”為“none”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（4）制作導(dǎo)航部分8）在“選擇器”窗格中添加偽錨記選擇器“a.nav:hover”，在“屬性”窗格中，設(shè)置“font-family”為宋體、“font-size”為13px、“color”為#FF0004、“l(fā)ine-height”為40px、“font-weight”為“bold”、“text-decoration”為“none”。9）在“選擇器”窗格中添加偽錨記選擇器“a.nav:active”，在“屬性”窗格中，設(shè)置“font-family”為宋體、“font-size”為13px、“color”為#FF0004、“l(fā)ine-height”為40px、“font-weight”為“bold”、“text-decoration”為“underline”。導(dǎo)航部分在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分1）插入一個(gè)Div，設(shè)置如圖所示，在“插入”項(xiàng)中選擇“在標(biāo)簽后”、“<divid=’Top’>”，在“ID”中輸入“Main”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分2）為ID為“Main”的Div創(chuàng)建ID選擇器規(guī)則，在“方框”中設(shè)置“Width”為1004px、“Height”為365px。在“背景”中設(shè)置“Background-image”為“Main_bg.jpg”。ID為“Main”的Div在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分3）刪除默認(rèn)的文字，插入一個(gè)Div，設(shè)置如圖所示，在“插入”項(xiàng)中選擇“在標(biāo)簽開(kāi)始之后”、“<divid=’Main’”>，在“ID”中輸入“Main-left”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分4）為ID為“#Main-left”的Div創(chuàng)建ID選擇器規(guī)則，在“方框”中設(shè)置“Width”為456px、“Height”為365px、“Float”為left。取消“Padding”中的“全部相同”的對(duì)勾，設(shè)置“Left”為46px。ID為“Main-left”的Div在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分5）刪除默認(rèn)的文字，插入一個(gè)Div，設(shè)置如圖12-48所示，在“插入”項(xiàng)中選擇“在標(biāo)簽開(kāi)始之后”、“<divid=’Main-left’”>，在“ID”中輸入“Title”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分6）為ID為“Title”的Div創(chuàng)建ID選擇器規(guī)則，并在“方框”中設(shè)置“Width”為441px、“Height”為26px。7）取消“Padding”中的“全部相同”的對(duì)勾，設(shè)置“Left”為15px。取消“Margin”中的“全部相同”的對(duì)勾，設(shè)置“Top”為74px。8）在“背景”中設(shè)置“Background-image”為“bg.gif”、“Background-repeat”為“no-repeat”，ID為“Title”的Div在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分9）刪除ID為“Title”的Div中默認(rèn)的文字，輸入文字“優(yōu)惠大贈(zèng)送Pimentarygift”，在“贈(zèng)送”文字的后面插入兩個(gè)全角空格。10）在“選擇器”窗格中添加類選擇器“.Title-write”，并選中，將“屬性”窗格切換到文本屬性，設(shè)置“font-family”為Arial、“font-size”為15px、“color”為#EEEEEE、“l(fā)ine-height”為26px、“font-weight”為“bold”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分11）在“選擇器”窗格中添加類選擇器“.Title-red”，并選中，將“屬性”窗格切換到文本屬性，設(shè)置“font-family”為微軟雅黑、“font-size”為15px、“color”為#D81316、“l(fā)ine-height”為26px、“font-weight”為“bold”。12）文本“優(yōu)惠大贈(zèng)送Pimentarygift”在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分13）插入一個(gè)Div，設(shè)置如圖所示，在“插入”項(xiàng)中選擇“在標(biāo)簽后”、“<divid=’Title’>”，在“ID”中輸入“Content”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分14）為ID為“Content”的Div創(chuàng)建ID選擇器規(guī)則，在“方框”中設(shè)置“Width”為426px、“Height”為175px，取消“Padding”中的“全部相同”的對(duì)勾，設(shè)置“Top”為15px、“Right”為15px、“Bottom”為0px、“Left”為15px。15）在“類型”中設(shè)置“Font-family”為“宋體”、“Font-size”為13px、“Line-height”為26px、“Font-weight”為“bold”、“Color”為“#EEEEEE”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（5）制作“優(yōu)惠大贈(zèng)送”部分16）將默認(rèn)的文本刪除，輸入文字素材中相應(yīng)的文字，并在“凡時(shí)”和“現(xiàn)場(chǎng)”文字前分別輸入兩個(gè)全角空格，“優(yōu)惠大贈(zèng)送”部分在網(wǎng)頁(yè)中的效果如圖所示。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（6）制作用戶登錄部分1）插入一個(gè)Div，設(shè)置如圖所示，在“插入”項(xiàng)中選擇“在標(biāo)簽后”、“<divid=’Content’>”，在“ID”中輸入“Login”。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（6）制作用戶登錄部分2）為ID為“Login”的Div創(chuàng)建ID選擇器規(guī)則，在“方框”中設(shè)置“Width”為100%、“Height”為27px，取消“Margin”中的“全部相同”的對(duì)勾，設(shè)置“Top”為20px。3）在“類型”中設(shè)置“Font-family”為“宋體”、“Font-size”為13px、“Font-weight”為“bold”、“Color”為“#DDDDDD”。4）將ID為“Login”的Div中默認(rèn)的文本刪除，在其中插入表單域，在再表單域中插入一個(gè)文本框和一個(gè)密碼框，將文本框的文字改為“用戶名：”，將密碼框的文字改為“密碼：”，選中文本框，在“屬性”面板中將“size”設(shè)置為15，同樣設(shè)置密碼框。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（6）制作用戶登錄部分5）將光標(biāo)定位在密碼框后面，插入提交按鈕和重置按鈕。保存，預(yù)覽，用戶登錄部分在網(wǎng)頁(yè)中的效果如圖所示。此時(shí)，按鈕因前面設(shè)置的“*”選擇器規(guī)則，去掉了邊界等，并非我們希望的，可以進(jìn)行美化。12.2案例制作：網(wǎng)站“葆偉汽車”12.2案例制作：網(wǎng)站“葆偉汽車”（6）制作用戶登錄部分6）在“選擇器”窗格中添加類選擇器“.button”，并選中，將“屬性”窗格切換到布局屬性，設(shè)置“padding”的上填充為1px、右填充為6px、下填充為1px、左填充為6px，如圖所示。12.
溫馨提示
- 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。
最新文檔
- 敲墻清運(yùn)合同范例
- 沙石運(yùn)輸協(xié)議合同范例
- 地勘工程合同范例
- 官方購(gòu)房合同范例
- 養(yǎng)殖動(dòng)物服務(wù)合同范例
- 奶茶屋轉(zhuǎn)讓合同范例
- 專賣店 合作合同范例
- 2025年江門(mén)貨運(yùn)資格證模擬考試題
- 用人承攬合同范例簡(jiǎn)易
- 合同范例多大尺寸
- pH值的測(cè)定方法
- 《紅燈停綠燈行》ppt課件
- 小學(xué)語(yǔ)文作文技巧六年級(jí)寫(xiě)人文章寫(xiě)作指導(dǎo)（課堂PPT）
- 《APQP培訓(xùn)資料》
- PWM脈寬直流調(diào)速系統(tǒng)設(shè)計(jì)及 matlab仿真驗(yàn)證
- 蜂窩煤成型機(jī)設(shè)計(jì)方案.doc
- 家具銷售合同,家居訂購(gòu)訂貨協(xié)議A4標(biāo)準(zhǔn)版（精編版）
- 食品加工與保藏課件
- 有功、無(wú)功控制系統(tǒng)(AGCAVC)技術(shù)規(guī)范書(shū)
- 儲(chǔ)罐施工計(jì)劃
- 【原創(chuàng)】“有理數(shù)比較大小”說(shuō)課稿
評(píng)論
0/150
提交評(píng)論