1、主講：主講：網頁設計與制作Dreamweaver CS3項目八 制作購物網頁任務一 制作頁眉任務二 制作網頁主體項目八：項目八： 制作購物網頁制作購物網頁網 頁 設 計 與 制 作Dreamweaver CS3任務一任務二任務三 制作頁腳小 結任務三實 訓任務一 制作頁眉 在現代網頁布局中，Div標簽是經常使用到的。但Div本身只是一個區域標簽，不能定位與布局，真正定位的是CSS代碼。本任務主要介紹購物網頁頁眉的制作及使用CSS樣式控制其外觀的基本方法。Dreamweaver CS3網 頁 設 計 與 制 作項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓操作一 布局網

2、站標識Dreamweaver CS3網 頁 設 計 與 制 作本操作主要介紹插入本操作主要介紹插入Div標簽以及簡單使用標簽以及簡單使用CSS樣式的基樣式的基本方法。通過本操作的學習，應該掌握的內容主要有：本方法。通過本操作的學習，應該掌握的內容主要有： 1. 插入Div標簽 將光標置于文檔內，然后在主菜單中選擇將光標置于文檔內，然后在主菜單中選擇【插入記錄插入記錄】【布局對象布局對象】【Div標簽標簽】命令（或在命令（或在【插入插入】【布局布局】面面板中單擊板中單擊 按鈕）打開按鈕）打開【插入插入Div標簽標簽】對話框對話框。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三

3、實 訓操作一 布局網站標識Dreamweaver CS3網 頁 設 計 與 制 作項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓2.使用Div標簽布局網頁 使用使用Div標簽布局網頁，它的對齊方式只有標簽布局網頁，它的對齊方式只有“左對齊左對齊”和和“右對齊右對齊”，如果要使，如果要使Div標簽居中顯示，可以將它的邊界，特標簽居中顯示，可以將它的邊界，特別是左邊界和右邊界設置為別是左邊界和右邊界設置為“自動自動”即可。即可。 Div標簽標簽【屬性屬性】面板比較簡單，只有面板比較簡單，只有【Div ID】和和【類類】兩個下拉菜單項和一個按鈕。使用兩個下拉菜單項和一個按鈕

4、。使用Div標簽布局網頁必須和標簽布局網頁必須和CSS相結合，它的大小、背景等內容需要通過相結合，它的大小、背景等內容需要通過CSS來控制。來控制。 操作一 布局網站標識Dreamweaver CS3網 頁 設 計 與 制 作項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓3.認識【CSS樣式】面板 在主菜單中選擇在主菜單中選擇【窗口窗口】【CSS樣式樣式】命令，即在命令，即在【CSS樣樣式式】命令前打上命令前打上“”，即可打開，即可打開【CSS樣式樣式】面板。如果想關面板。如果想關閉閉【CSS樣式樣式】面板，把該命令前的面板，把該命令前的“”去掉即可。去掉即可。 也可

5、以單擊也可以單擊【CSS樣式樣式】面板右上角菜單圖標，在彈出的菜面板右上角菜單圖標，在彈出的菜單中選擇單中選擇【關閉關閉CSS樣式樣式】命令，或在面板標題欄上單擊鼠標右命令，或在面板標題欄上單擊鼠標右鍵，在彈出的快捷菜單中選擇鍵，在彈出的快捷菜單中選擇【關閉關閉CSS樣式樣式】命令來關閉命令來關閉【CSS樣式樣式】面板。面板。Dreamweaver CS3網 頁 設 計 與 制 作操作一 布局網站標識4.創建CSS樣式的方法 在在【CSS樣式樣式】面板中單擊面板中單擊 （新建（新建CSS規則）按鈕，彈出規則）按鈕，彈出【新建新建CSS規則規則】對話框，在對話框中選擇選擇器類型并設置其對話框，在

6、對話框中選擇選擇器類型并設置其名稱，然后在名稱，然后在【定義在定義在】選項中選擇選項中選擇CSS樣式保存的位置，樣式保存的位置，最后最后在在【類型類型】等對話框中根據需要設置樣式參數即可。等對話框中根據需要設置樣式參數即可。 【定義在定義在】選項有兩個單選項，它們決定了所創建的選項有兩個單選項，它們決定了所創建的CSS樣樣式的保存方法。點選式的保存方法。點選【僅對該文檔僅對該文檔】單選按鈕，則將單選按鈕，則將CSS樣式保樣式保存在當前的文檔中，包含在文檔的頭部標簽存在當前的文檔中，包含在文檔的頭部標簽“”內。而如果點選內。而如果點選【新建樣式表文件新建樣式表文件】單選按鈕，則將新建一個專單選按

7、鈕，則將新建一個專門用來保存門用來保存CSS樣式的文件，它的文件擴展名為樣式的文件，它的文件擴展名為“*.css”。網頁。網頁文檔要使用樣式表文件中的文檔要使用樣式表文件中的CSS樣式時，將通過樣式時，將通過“附加樣式表附加樣式表”命令，將命令，將CSS文件鏈接或者導入到文檔中。文件鏈接或者導入到文檔中。 項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作一 布局網站標識項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓操作二 布局導航欄Dreamweaver CS3網 頁 設 計 與 制

8、作本操作主要介紹使用本操作主要介紹使用Div標簽和標簽和CSS樣式布局導航欄的基本方法。樣式布局導航欄的基本方法。通過本操作的學習，應該掌握的內容主要有：通過本操作的學習，應該掌握的內容主要有： 1. 什么是CSS樣式 CSS是是“Cascading Style Sheet”的縮寫，可譯為的縮寫，可譯為“層疊樣層疊樣式表式表”或或“級聯樣式表級聯樣式表”。形象地說，。形象地說，CSS可以使直線顯示為虛可以使直線顯示為虛線，可以使表格只顯示一條邊框，可以使網頁背景固定不動，可線，可以使表格只顯示一條邊框，可以使網頁背景固定不動，可以使文字產生陰影等效果。可以說，以使文字產生陰影等效果。可以說，C

9、SS簡化了簡化了HTML中各種煩中各種煩瑣的標簽，擴展了原先的標簽功能，能夠實現更多的效果。瑣的標簽，擴展了原先的標簽功能，能夠實現更多的效果。 項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作二 布局導航欄2. CSS規則的類型 在在【新建新建CSS規則規則】對話框中，對話框中，CSS樣式被劃分為樣式被劃分為3種類型。種類型。（1）類（可應用于任何標簽）類（可應用于任何標簽） 由用戶自定義的由用戶自定義的CSS樣式，能夠應用到網頁中的任何標簽上，樣式，能夠應用到網頁中的任何標簽上，需要用戶手動進行設置。如應用

10、到一個段落標簽需要用戶手動進行設置。如應用到一個段落標簽“p”上，那么一上，那么一個個“class”屬性就會被添加到文本塊標簽上（如屬性就會被添加到文本塊標簽上（如“p class=myStyle”）。）。（2）標簽（重新定義特定標簽的外觀）標簽（重新定義特定標簽的外觀） 對現有的對現有的HTML標簽進行重新定義，當創建或改變該樣式時，標簽進行重新定義，當創建或改變該樣式時，所有應用了該樣式的格式都會自動更新。例如，當創建或修改所有應用了該樣式的格式都會自動更新。例如，當創建或修改“h1”標簽（標題標簽（標題1）的）的CSS樣式時，所有用樣式時，所有用“h1”標簽進行格式標簽進行格式化的文本都

11、將被立即更新。化的文本都將被立即更新。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作二 布局導航欄（3）高級（）高級（ID、偽類選擇器等）、偽類選擇器等） 該樣式是對某些標簽組合（如該樣式是對某些標簽組合（如“td h2”表示所有在單元格中表示所有在單元格中出現出現“h2”的標題）或者是含有特定的標題）或者是含有特定ID屬性的標簽（如屬性的標簽（如“#myStyle”表示所有屬性值中有表示所有屬性值中有“ID=myStyle”的標簽）應用的標簽）應用樣式。樣式設置好后，樣式。樣式設置好后，Dreamweave

12、r會自動應用該樣式。而會自動應用該樣式。而“#myStyle1 a:visited,#myStyle2 a:link, #myStyle3”表示可以一表示可以一次性定義相同屬性的多個次性定義相同屬性的多個CSS樣式。樣式。 另外，在另外，在【定義在定義在】選項中，選擇選項中，選擇【僅對該文檔僅對該文檔】選項，將選項，將會將新建的會將新建的CSS規則寫入到當前網頁文件中，否則將新建的規則寫入到當前網頁文件中，否則將新建的CSS規則保存到擴展名為規則保存到擴展名為“*.css”的樣式表文件中。的樣式表文件中。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweav

13、er CS3網 頁 設 計 與 制 作操作二 布局導航欄3.認識【CSS規則定義】對話框（1）【類型類型】屬性對話框屬性對話框 【類型類型】屬性主要用于定義網頁中文本的字體、大小、顏色、屬性主要用于定義網頁中文本的字體、大小、顏色、樣式及文本鏈接的修飾線等，所包含的樣式及文本鏈接的修飾線等，所包含的9種種CSS屬性，全部是針屬性，全部是針對網頁中的文本的。對網頁中的文本的。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作二 布局導航欄（2）【背景背景】屬性對話框屬性對話框 【背景背景】分類屬性的功能主要是在網頁

14、元素后面加入背景顏分類屬性的功能主要是在網頁元素后面加入背景顏色或背景圖像。色或背景圖像。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作二 布局導航欄（3）【區塊區塊】屬性對話框屬性對話框 CSS中的中的【區塊區塊】屬性指的是網頁中的文本、圖像和層等替屬性指的是網頁中的文本、圖像和層等替代元素，它主要用于控制塊中內容的間距、對齊方式和文字縮進代元素，它主要用于控制塊中內容的間距、對齊方式和文字縮進等。等。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網

15、頁 設 計 與 制 作操作二 布局導航欄項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓（4）【方框方框】屬性對話框屬性對話框 CSS將網頁中所有的塊元素都看作是包含在一個方框中的，將網頁中所有的塊元素都看作是包含在一個方框中的，這個方框共分為這個方框共分為4個部分：方框、填充、邊界和邊框個部分：方框、填充、邊界和邊框。【方框方框】屬性主要用來定義方框、填充、邊界屬性主要用來定義方框、填充、邊界3個部分。個部分。操作二 布局導航欄Dreamweaver CS3網 頁 設 計 與 制 作4. 3種選擇器各自的特點 【類類】CSS樣式用來存放文檔中標簽的共同屬性，網頁元素樣

16、式用來存放文檔中標簽的共同屬性，網頁元素使用該類使用該類CSS樣式時，需要添加引用。樣式時，需要添加引用。 【標簽標簽】CSS樣式用來改變或者擴展文檔中某些特定的樣式用來改變或者擴展文檔中某些特定的HTML標簽的屬性。標簽的屬性。 【高級高級】CSS樣式是改變標簽組合、命名樣式是改變標簽組合、命名ID標簽屬性最好的標簽屬性最好的方式。方式。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓操作二 布局導航欄Dreamweaver CS3網 頁 設 計 與 制 作5. 創建高級CSS樣式的方法 在在【CSS樣式樣式】面板中直接創建高級面板中直接創建高級CSS樣式的方法是，單

17、樣式的方法是，單擊擊 （新建（新建CSS規則）按鈕，彈出規則）按鈕，彈出【新建新建CSS規則規則】對話框，選對話框，選擇擇【高級高級】選項。在選項。在【選擇器選擇器】列表框中輸入高級列表框中輸入高級CSS樣式名稱，樣式名稱，如如“#navigate”，然后在，然后在【定義在定義在】選項中定義選項中定義CSS樣式的保存樣式的保存位置，最后單擊位置，最后單擊 按鈕打開按鈕打開【CSS規則定義規則定義】對話框根據對話框根據需要設置參數即可。需要設置參數即可。 項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓操作二 布局導航欄Dreamweaver CS3網 頁 設 計 與 制

18、 作 超級鏈接的高級超級鏈接的高級CSS樣式是經常用到的，平時使用時通常定義兩組：樣式是經常用到的，平時使用時通常定義兩組：一組是當前和已訪問狀態，另一組是鼠標懸停狀態。如果一個頁面有多一組是當前和已訪問狀態，另一組是鼠標懸停狀態。如果一個頁面有多種形式的超級鏈接樣式，為了區別，定義時需要在其前面加限制成分，種形式的超級鏈接樣式，為了區別，定義時需要在其前面加限制成分，例如：例如：“#navigate a:link,#navigate a:visited” 和和“#navigate a:hover”，其中其中“navigate”為導航欄為導航欄Div標簽的名稱，這就是說只有名稱為標簽的名稱，這

19、就是說只有名稱為“navigate”的的Div標簽內的超級鏈接才應用該樣式。如果超級鏈接所在標簽內的超級鏈接才應用該樣式。如果超級鏈接所在的對象使用了類樣式，在定義超級鏈接的高級的對象使用了類樣式，在定義超級鏈接的高級CSS樣式時，也可以使用樣式時，也可以使用類名稱作限制成分，例如：類名稱作限制成分，例如：“.tdstyle a:link,.tdstyle a:visited”和和“.tdstyle a:hover”（類名稱前的點是不能丟的），這就是說，只有應用（類名稱前的點是不能丟的），這就是說，只有應用了類了類CSS樣式樣式“.tdstyle ”的對象內的超級鏈接才應用該超級鏈接樣式。的對

20、象內的超級鏈接才應用該超級鏈接樣式。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓 在本項目制作的購物網頁中，購物網頁在本項目制作的購物網頁中，購物網頁左側部分仍然是商品的導航欄，中間和右側左側部分仍然是商品的導航欄，中間和右側部分為具體商品介紹和新品推薦等。本任務部分為具體商品介紹和新品推薦等。本任務主要介紹購物網頁主體部分的制作及使用主要介紹購物網頁主體部分的制作及使用CSS樣式控制網頁外觀的基本方法。樣式控制網頁外觀的基本方法。Dreamweaver CS3網 頁 設 計 與 制 作任務二 制作網頁主體項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結

21、任務三實 訓操作一 制作左側欄目Dreamweaver CS3網 頁 設 計 與 制 作 本操作主要是制作購物網頁左側欄目。通過本操作的學習，本操作主要是制作購物網頁左側欄目。通過本操作的學習，應該掌握的內容主要有：應該掌握的內容主要有： 1. 【邊框】分類對話框【邊框邊框】分類對話框主要用于設置網頁元素的邊框效果。分類對話框主要用于設置網頁元素的邊框效果。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作一 制作左側欄目2.創建和應用類樣式的方法項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三

22、實 訓 在在【CSS樣式樣式】面板中單擊面板中單擊 （新建（新建CSS規則）按鈕，彈出規則）按鈕，彈出【新建新建CSS規則規則】對話框，在對話框，在【選擇器類型選擇器類型】選項中選擇選項中選擇【類類】單選按鈕，在單選按鈕，在【名稱名稱】文本框中輸入文本框中輸入CSS樣式名稱樣式名稱“.leftdiv”，單，單擊擊 按鈕后在按鈕后在【CSS規則定義規則定義】對話框中根據需要設置參對話框中根據需要設置參數即可。數即可。CSS樣式定義完畢后，在單元格樣式定義完畢后，在單元格【屬性屬性】面板的面板的【樣式樣式】下拉列表中選擇定義的樣式名稱下拉列表中選擇定義的樣式名稱“leftdiv”，將其應用到對象上

23、。，將其應用到對象上。 Dreamweaver CS3網 頁 設 計 與 制 作操作一 制作左側欄目項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓3.【改變屬性】行為 選中選中Div標簽標簽“mainleft-1”，然后選擇，然后選擇【窗口窗口】【行為行為】命令打開命令打開【行為行為】面板，單擊面板，單擊 按鈕，在彈出的菜單中選擇按鈕，在彈出的菜單中選擇【改變屬性改變屬性】命令打開命令打開【改變屬性改變屬性】對話框并進行參數設置，最對話框并進行參數設置，最后在后在【行為行為】面板中將觸發事件設置為面板中將觸發事件設置為“onMouseOver”。運用。運用同樣的方法再

24、添加一次該行為，中將觸發事件設置為同樣的方法再添加一次該行為，中將觸發事件設置為“onMouseOut”。注意兩次設置的背景顏色不一樣，觸發事件也。注意兩次設置的背景顏色不一樣，觸發事件也不一樣。不一樣。Dreamweaver CS3網 頁 設 計 與 制 作操作一 制作左側欄目項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作二 制作右側欄目 本操作主要是制作購物網頁右側部分的內容。通過本操作的本操作主要是制作購物網頁右側部分的內容。通過本操作的學習，應該掌握的內容主要有：學習，應該掌握的內容主要有：1. CS

25、S樣式與表格的結合 在本部分，應進一步熟悉如何使用在本部分，應進一步熟悉如何使用CSS樣式控制表格及其單樣式控制表格及其單元格的樣式，包括兩種方式：元格的樣式，包括兩種方式：（1）ID名稱高級名稱高級CSS樣式，樣式， 即利即利用表格和單元格的用表格和單元格的ID名稱定義高級名稱定義高級CSS樣式，但這種方式只能用樣式，但這種方式只能用1次，在實際網頁制作中應用的情況相對少；（次，在實際網頁制作中應用的情況相對少；（2）類）類CSS樣式，樣式，即創建通用的類即創建通用的類CSS樣式，將其應用到表格或單元格上，這是比樣式，將其應用到表格或單元格上，這是比較好的方式，也是比較常用的方式，因為它可以

26、反復被引用。較好的方式，也是比較常用的方式，因為它可以反復被引用。 項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作二 制作右側欄目2. 【列表】屬性對話框項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓 用于控制列表內的各項元素，包含以下用于控制列表內的各項元素，包含以下3種種CSS屬性。屬性。 （1）【類型類型】屬性用于確定列表內每一項前使用的符號。屬性用于確定列表內每一項前使用的符號。 （2）【項目符號圖像項目符號圖像】作用是將列表前面的符號換為圖形。作用是將列表前面的符號換為圖形

27、。 （3）【位置位置】屬性用于描述列表的位置，有屬性用于描述列表的位置，有【外外】（在方框（在方框之外顯示）和之外顯示）和【內內】（在方框之內顯示）兩個選項。（在方框之內顯示）兩個選項。Dreamweaver CS3網 頁 設 計 與 制 作操作二 制作右側欄目3. 【定位】屬性對話框 可疑使網頁元素隨處浮動，這對于一些固定元素（如表格）可疑使網頁元素隨處浮動，這對于一些固定元素（如表格）來說，是一種功能的擴展，而對于一些浮動元素（如來說，是一種功能的擴展，而對于一些浮動元素（如AP Div）來）來說，卻是有效地、用于精確控制其位置的方法。說，卻是有效地、用于精確控制其位置的方法。 項目八：項

28、目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作操作二 制作右側欄目4. 【擴展】屬性對話框 包含兩部分：包含兩部分：【分頁分頁】的作用是為打印的頁面設置分頁符；的作用是為打印的頁面設置分頁符；【視覺效果視覺效果】的作用是為網頁中的元素施加特殊效果，其中的作用是為網頁中的元素施加特殊效果，其中【光光標標】選項可以指定在某個元素上要使用的光標形狀，選項可以指定在某個元素上要使用的光標形狀，【濾鏡濾鏡】可可以為網頁元素施加多種特殊的顯示效果，如陰影、模糊、透明、以為網頁元素施加多種特殊的顯示效果，如陰影、模糊、透明、光暈等。光暈

29、等。 項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作任務三 制作頁腳 本任務主要是制作購物網頁頁腳部分的內容。通過本任務的本任務主要是制作購物網頁頁腳部分的內容。通過本任務的學習，應該掌握的內容主要有：學習，應該掌握的內容主要有：1. 關于標簽CSS樣式 前面已經介紹了高級前面已經介紹了高級CSS樣式和類樣式和類CSS樣式的創建方法，關樣式的創建方法，關于標簽于標簽CSS樣式的創建過程類似，只不過它是重新定義現有標簽樣式的創建過程類似，只不過它是重新定義現有標簽的的CSS樣式。這種方法用的場合比較少，因為一旦定義

30、了該種樣樣式。這種方法用的場合比較少，因為一旦定義了該種樣式，網頁中的所有對應的式，網頁中的所有對應的HTML標簽都將應用該樣式，這必將破標簽都將應用該樣式，這必將破壞整個網頁的外觀。如果該種樣式是放在單獨的壞整個網頁的外觀。如果該種樣式是放在單獨的CSS樣式表文件樣式表文件中，那影響范圍就更大了，所以通常不建議使用標簽中，那影響范圍就更大了，所以通常不建議使用標簽CSS樣式。樣式。這也是本部分為什么創建高級這也是本部分為什么創建高級CSS樣式樣式“#foot p”，而不創建標簽，而不創建標簽CSS樣式樣式“p”的原因。當然，如果創建類的原因。當然，如果創建類CSS樣式來控制樣式來控制“p”更

31、更好。好。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作任務三 制作頁腳2. 修改CSS樣式的方法 （1）第）第1種是在種是在【CSS樣式樣式】面板中雙擊樣式名稱，或先選面板中雙擊樣式名稱，或先選中樣式再單擊面板底部的中樣式再單擊面板底部的 （編輯）按鈕，或在鼠標右鍵快捷菜（編輯）按鈕，或在鼠標右鍵快捷菜單中選擇單中選擇【編輯編輯】命令打開命令打開【CSS規則定義規則定義】對話框進行可視化對話框進行可視化定義或修改。定義或修改。 （2）第）第2種是在種是在【CSS樣式樣式】面板中先選中樣式名稱，然后面板中先選中樣

32、式名稱，然后在在【CSS樣式樣式】面板的屬性列表框中進行定義或修改。面板的屬性列表框中進行定義或修改。 （3）第）第3種是在種是在【CSS樣式樣式】面板中用鼠標右鍵單擊樣式名面板中用鼠標右鍵單擊樣式名稱，在其快捷菜單中選擇稱，在其快捷菜單中選擇【轉到代碼轉到代碼】命令將進入文檔中源代碼命令將進入文檔中源代碼處，可以直接修改源代碼。處，可以直接修改源代碼。項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作任務三 制作頁腳3. 刪除CSS樣式的方法 （1）第）第1種是在種是在【CSS樣式樣式】面板中先選中樣式名稱再單擊面

33、板中先選中樣式名稱再單擊面板底部的面板底部的 （刪除）按鈕進行刪除。（刪除）按鈕進行刪除。 （2）第）第2種是在種是在【CSS樣式樣式】面板中用鼠標右鍵單擊樣式名面板中用鼠標右鍵單擊樣式名稱，在其快捷菜單中選擇稱，在其快捷菜單中選擇【刪除刪除】命令。命令。 （3）第）第3種是在種是在【CSS樣式樣式】面板中用鼠標右鍵單擊樣式名面板中用鼠標右鍵單擊樣式名稱，在其快捷菜單中選擇稱，在其快捷菜單中選擇【轉到代碼轉到代碼】命令進入文檔源代碼處，命令進入文檔源代碼處，直接刪除源代碼。直接刪除源代碼。4.對樣式重新命名的方法 在在【CSS樣式樣式】面板中用鼠標右鍵單擊樣式名稱，在其快捷面板中用鼠標右鍵單擊樣式名稱，在其快捷菜單中選擇菜單中選擇【重命名重命名】命令或直接在源代碼中進行修改。命令或直接在源代碼中進行修改。 項目八：項目八： 制作購物網頁制作購物網頁任務一任務二小 結任務三實 訓Dreamweaver CS3網 頁 設 計 與 制 作任務三 設置頁腳的CSS規則5.應用CSS樣式的方式 應用應用CSS樣式包括自定義樣式包括自定義CSS樣式的應用和鏈接外部樣式的應用和鏈接外部CSS樣式樣式的應用兩種方式。在的應用兩種方式。在CSS樣式中的樣式中的HTML標簽樣式和標簽樣式和C