chapter3課件(利用表格設(shè)計(jì)和制作網(wǎng)頁)

《chapter3課件(利用表格設(shè)計(jì)和制作網(wǎng)頁)》由會員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在應(yīng)用文檔-天天文庫。

1、網(wǎng)頁實(shí)訓(xùn)——利用表格設(shè)計(jì)和制作網(wǎng)頁·4·第3單元利用表格設(shè)計(jì)和制作網(wǎng)頁實(shí)訓(xùn)目標(biāo)網(wǎng)頁實(shí)訓(xùn)——利用表格設(shè)計(jì)和制作網(wǎng)頁·4·F　調(diào)整第2個外表格各單元格的寬度，效果如圖6.28所示。操作步驟如下：（1）將插入點(diǎn)置于第1個單元格中，將單元格的寬度設(shè)置為130像素。（2）將第1個單元格拆分為2行，其中第2行單元格的高度設(shè)置為60像素，并將“用戶登錄”圖像置于第2行單元格中。在單元格屬性面板的“水平”下拉列表框中選擇“右對齊”?！≡O(shè)置單元格屬性前后的效果對照（3）將插入點(diǎn)置于第2個單元格中，將單元格的寬度設(shè)置為260

2、像素。F　設(shè)置第3個外表格及其內(nèi)嵌表格的單元格屬性，效果如圖所示。操作步驟如下：　設(shè)置垂直對齊方式為“頂端”前后的效果對照（1）將第3個外表格的第1列的單元格的垂直對齊方式設(shè)置為“頂端”。（2）將第3個外表格的第2行第2列的單元格高度設(shè)置為136像素。（3）將的“未來都市”及“未來旅游”欄目表格中的第1行的行高均設(shè)置為30像素。F　為第4個外表格中的各單元格分別設(shè)置背景顏色，操作步驟如下：（1）將插入點(diǎn)置于第1行的單元格中，在屬性面板的背景顏色文本框中直接輸入事先設(shè)計(jì)好的顏色代碼“#034A82”。（2）

3、同時選中表格的第2行和第3行，在屬性面板的背景顏色文本框中直接輸入事先設(shè)計(jì)好的顏色代碼“#A8D4F0”。并將其行高分別設(shè)置為30像素和60像素。（3）將第3行單元格的“水平”對齊方式設(shè)置為“居中對齊”。網(wǎng)頁實(shí)訓(xùn)——利用表格設(shè)計(jì)和制作網(wǎng)頁·4·任務(wù)五、表格的高級應(yīng)用技巧F　將第4個表格的第1行單元格制作水平線細(xì)線，效果如圖所示。操作步驟如下：水平線細(xì)線（1）將插入點(diǎn)置于第4個表格的第1行單元格中。（2）在單元格屬性面板的“高”文本框中輸入2并在單元格中插入一個大小為1像素的spacer.gif透明圖像。s

4、pacer.gif透明圖像的制作方法為：（a）在菜單欄中選擇“編輯”→“首選參數(shù)”命令，打開“首選參數(shù)”對話框，如圖所示。（b）在“分類”列表中中選擇“布局模式”，然后在對話框的右邊單擊創(chuàng)建按鈕，打開“保存間隔圖像文件為”對話框，Dreamweaver自動生成大小為1像素的spacer.gif圖像，將其保存到本地站點(diǎn)的images文件夾下?！笆走x參數(shù)”對話框（c）在“首選參數(shù)”對話框中單擊“確定”。（4）再選取第1行單元格，并將高度調(diào)整為5像素（大致和頁眉上的橫線高度相同）。F　將第1個表格中的內(nèi)嵌導(dǎo)航欄

5、表格制作成立體導(dǎo)航欄表格，效果如圖所示。操作步驟如下：立體導(dǎo)航欄表格（1）選中第1個表格中的內(nèi)嵌導(dǎo)航欄表格，將邊框設(shè)置為1，邊框顏色設(shè)置為“#FFFFFF”。（2）在表格屬性面板中單擊快速標(biāo)簽編輯器按鈕，在標(biāo)簽編輯框中添加代碼“bordercolorlight="#333333"”。（3）按F12鍵，保存并預(yù)覽網(wǎng)頁。效果如圖所示。網(wǎng)頁實(shí)訓(xùn)——利用表格設(shè)計(jì)和制作網(wǎng)頁·4·“標(biāo)簽編輯器-Table”對話框