DW MX實(shí)例:利用表格美化頁面_Dreamweaver教程
在瀏覽網(wǎng)頁的時(shí)候可以發(fā)現(xiàn),很多用于網(wǎng)站排版的表格都是經(jīng)過美化處理的,這些表格不僅起了布局排版的作用,而且在很大程度上美化了網(wǎng)頁,使網(wǎng)頁看起來更加漂亮、新奇。
效果說明 利用表格美化頁面的方式有很多種。本例制作出來的帶有層次感的表格如圖 8-1 所示。
創(chuàng)作思想 利用表格美化頁面并不需要很多的制作技巧。例如本例只需要進(jìn)行簡單的表格嵌套(即在表格中插入表格),即可達(dá)到美化效果。
操作步驟
( 1 )新建一個(gè)頁面文件,然后在編輯區(qū)域中插入一個(gè) 2 × 1 的表格,并設(shè)置表格的基本屬性參數(shù),如圖 8-2 所示。
( 2 )設(shè)置表格。將光標(biāo)置于第一行的單元格中,再將單元格的背景顏色設(shè)置為 # 69A 538 ,并應(yīng)用同樣的方法將第二行單元格的背景顏色設(shè)置為 #8FCB 5A 。設(shè)置完成后將光標(biāo)至于第一行的單元格中,然后在此單元格中插入一個(gè) 1 × 5 的表格,并設(shè)置表格的基本屬性參數(shù),如圖 8-3 所示。
( 3 )錄入文字并設(shè)置單元格。在新插入的表格的所有單元格中輸入文字,然后選中所有單元格,設(shè)置單元格的相關(guān)屬性,如圖 8-4 所示。( 4 )改變其中一個(gè)單元格的文字顏色和背景顏色,使其突出顯示,如圖 8-5 所示。
( 5 )保存頁面文件并按 F12 鍵進(jìn)行預(yù)覽,此時(shí)即可得到帶有層次感的表格效果。至此,
本實(shí)例操作完畢。讀者可參考隨書光盤中本實(shí)例素材文件夾里的 mhtable.htm 文件,查看制作的結(jié)果是否正確。表格是網(wǎng)頁中必不可少的元素之一,美化表格也就順理成章,成為決定網(wǎng)頁美觀與否的要害。
- 用Dreamweaver在網(wǎng)頁中插入Flash按鈕
- 在Dreamweaver中編寫CSS需要掌握的技巧
- Dreamweaver CS3代碼片斷功能面板的利用
- Dreamweaver CS3 的最新功能
- 用Dreamweaver建站如何設(shè)計(jì)CSS?
- Dreamweaver文字自動(dòng)換行
- 探討Dreamweaver制作網(wǎng)頁時(shí)的空格
- 使用Dreamweaver制作網(wǎng)頁的20個(gè)技巧
- Dreamweaver MX 2004的PPT格式課件
- Dreamweaver技巧:運(yùn)用代碼片斷工具提高css開發(fā)效率
- 在DreamWeaver中編寫CSS的一些技巧
- 使用Dreamweaver模板批量制作網(wǎng)頁
Dreamweaver教程Rss訂閱網(wǎng)站制作教程搜索
Dreamweaver教程推薦
- 技巧:用Dreamweaver進(jìn)行網(wǎng)頁優(yōu)化
- 在網(wǎng)頁調(diào)用 WINDOWS 控件兩例
- Dreamweaver MX2004視頻寶典教程 網(wǎng)頁布局
- DW MX 2004網(wǎng)頁中文亂碼問題:常見原因
- Dreamweaver制作網(wǎng)頁的圖片應(yīng)用技巧
- 如何用Dreamweaver批量做web網(wǎng)頁
- 解決Dreamweaver中關(guān)于應(yīng)用CSS的小問題
- 用Dreamweaver 8 搞定“web標(biāo)準(zhǔn)”
- 用Dreamweaver MX 2004的Flash動(dòng)畫元素
- 用DW制作網(wǎng)頁時(shí)關(guān)于文字自動(dòng)換行的小技巧
猜你也喜歡看這些
- 相關(guān)鏈接:
- 教程說明:
Dreamweaver教程-DW MX實(shí)例:利用表格美化頁面。