用Dreamweaver精細(xì)化網(wǎng)頁中表格的外觀(2)_Dreamweaver教程

(圖十一)
Width代表上下左右的邊框?qū)挾龋籆olor可以分別定義上下左右邊框的顏色;Style可以丁一邊框的樣式,常用的為solid(實(shí)線),其它類型還有:dotted(點(diǎn)線)、dashed(虛線)、double(雙線)、groove(槽線)、ridge(脊線)、inset(內(nèi)陷)、outset(外陷)。不過有幾個(gè)類型必須是IE5.5以上版本才可以看到的。
2、重新定義了<td>后的表格外觀如圖十二;

(圖十二)
3、我們?nèi)∠麑?duì)<td>的重新定義,單獨(dú)定義一個(gè).tdstyle樣式,具體參數(shù)如圖十三;

(圖十三)
注重在這里我們定義了頂端和下端的邊框?qū)挾葹?像素,左右兩邊的為0。
4、最后的表格效果見圖十四;

(圖十四)
我們可以看到此表格呈現(xiàn)只有橫線,沒有豎線的外觀。
5、改變上一步中Top和Left為1,Bottom和Right為0。表格效果如圖十五;

(圖十五)
此時(shí)表格呈現(xiàn)類似立體的效果。
6、上面這個(gè)表格感覺不太完美,整個(gè)表格的右邊和下方無邊框。我們可以再定義一個(gè)樣式.table1,定義此樣式的四邊都為1像素,并將它附給<table>,此時(shí)表格外觀如圖十六;

(圖十六)
小結(jié):合理利用上面介紹的表格技巧,可以非常方便的創(chuàng)造各種常見的表格樣式,從而達(dá)到美化你的頁面的目的。而樣式表的運(yùn)用更加擴(kuò)充了表格的樣式外觀,配合高瀏覽器的支持,可以實(shí)現(xiàn)更加多樣的效果,如虛線、立體線、等等。個(gè)人感覺在商業(yè)網(wǎng)站的設(shè)計(jì)中,更多的使用表格可以整加頁面層次,同時(shí)可以使頁面簡潔大方,但也要提醒大家在表格嵌套時(shí)的嵌套層次不要超過三層。
- 用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)頁
- 相關(guān)鏈接:
- 教程說明:
Dreamweaver教程-用Dreamweaver精細(xì)化網(wǎng)頁中表格的外觀(2)
。