主頁(yè) > 知識(shí)庫(kù) > 從Table向Css過(guò)渡的優(yōu)缺點(diǎn)比較

從Table向Css過(guò)渡的優(yōu)缺點(diǎn)比較

CSS布局提倡者的聲音正被"表格布局的優(yōu)點(diǎn)"的聲音所覆蓋。一個(gè)荒誕的說(shuō)法是CSS是難學(xué)的。事實(shí)上，CSS一點(diǎn)也不比其他網(wǎng)頁(yè)技術(shù)難。問(wèn)題在于：對(duì)于表格設(shè)計(jì)已經(jīng)相當(dāng)有經(jīng)驗(yàn)的web設(shè)計(jì)師不得不完全放棄他們的思維模式改用CSS方法。

我曾經(jīng)用表格布局設(shè)計(jì)過(guò)許多年，當(dāng)我第一次開(kāi)始使用CSS布局時(shí)，我也遇到了問(wèn)題。"用表格多簡(jiǎn)單呀"我想。但是，那只是因?yàn)槲乙呀?jīng)用慣了表格，我知道如何巧妙的處理它們。任何改變，哪怕是小小的一點(diǎn)，都會(huì)讓我覺(jué)得麻煩，更不用說(shuō)這么激烈的變化。

回憶起我第一次學(xué)習(xí)用表格布局，同樣有一大堆的問(wèn)題困繞著我?；仡^想想那些rowspans, colspans以及空白的GIF圖片，公平的說(shuō)這兩種布局方法，用表格布局更加難些。

另一個(gè)陳舊的觀點(diǎn)是：CSS設(shè)計(jì)的頁(yè)面(字節(jié)數(shù))非常大，比表格設(shè)計(jì)的頁(yè)面大。理由是：因?yàn)槟銓⒄麄€(gè)站點(diǎn)所有的樣式都放在一個(gè)文件里，當(dāng)用戶訪問(wèn)一個(gè)頁(yè)面，包含整個(gè)站點(diǎn)樣式的樣式表都需要下載，因此頁(yè)面非常大。

那么為什么你要將所有樣式都放在一個(gè)CSS文件里？沒(méi)有人限制你只能用一個(gè)CSS文件，你完全可以為某部分章節(jié)的細(xì)節(jié)樣式設(shè)立單獨(dú)的子樣式表文件。在我的經(jīng)驗(yàn)里，從簡(jiǎn)單的手冊(cè)型站點(diǎn)到大型的數(shù)據(jù)庫(kù)驅(qū)動(dòng)，多功能的系統(tǒng)網(wǎng)站，我從來(lái)沒(méi)有只用過(guò)單獨(dú)一個(gè)樣式表文件，沒(méi)有一個(gè)首頁(yè)的代碼比用表格設(shè)計(jì)的多。那些table,tr,td標(biāo)簽占據(jù)了大量空間，立刻行動(dòng)起來(lái)吧，用CSS布局方法將你的文件尺寸猛砍下來(lái)。

當(dāng)你用表格布局時(shí)，你失去了標(biāo)簽本身的語(yǔ)意。web標(biāo)準(zhǔn)方法布局分離了內(nèi)容和表現(xiàn)層將帶來(lái)巨大的好處。當(dāng)你用表格鎖定了你的設(shè)計(jì)，一旦你需要改變它，你必須找到這個(gè)頁(yè)面，然后再分析出表格結(jié)構(gòu)，再一頁(yè)一頁(yè)修改，而CSS文件可以簡(jiǎn)單的改變整個(gè)站點(diǎn)的設(shè)計(jì)。用CSS你根本無(wú)須考慮設(shè)備無(wú)關(guān)性，無(wú)須考慮用戶選擇他們自己的樣式。

還聽(tīng)說(shuō)一個(gè)表格的"好處":設(shè)計(jì)forms。但是forms可以用任何方法實(shí)現(xiàn)表格排列。是為了Netscape4? 我從來(lái)沒(méi)聽(tīng)說(shuō)過(guò)支持這么老的瀏覽器是一個(gè)理由。大部分主流瀏覽器的用戶利益遠(yuǎn)遠(yuǎn)大于少數(shù)的用不支持樣式表的瀏覽器的用戶的利益(先不說(shuō)CSS也支持純文本)。

那些"超級(jí)表格"支持者的觀點(diǎn)歸結(jié)起來(lái)就是一點(diǎn)："表格更容易。"這是胡說(shuō)！如果你滿足于一個(gè)低效率的方法，那隨你的便。如果你想突破限制，使頁(yè)面內(nèi)容更加通用、易用，代碼更加少，那就努力轉(zhuǎn)變吧。當(dāng)然如果你是新學(xué)網(wǎng)頁(yè)設(shè)計(jì)，從頭開(kāi)始，你就不會(huì)有這些問(wèn)題。

"小車不倒只管推","這只是設(shè)計(jì)師工具箱里的工具而已。"這是一些討論者的觀點(diǎn)。表格布局象一把老式的木頭柄螺絲起子，你可以仍舊使用它來(lái)鉆進(jìn)一面墻。而我寧愿使用電動(dòng)的螺絲起子，CSS布局更加高效，不會(huì)讓我的手再起水泡。

您可能感興趣的文章:

css ol有序列表
css列表前的小方塊
CSS List Grid Layout 圖片垂直居中
JS實(shí)現(xiàn)的樣式切換功能tableCSS實(shí)例
利用js+css+html實(shí)現(xiàn)固定table的列頭不動(dòng)
css之使table也能overflow:hidden
css+table 1px邊框單元格
css列表標(biāo)簽list與表格標(biāo)簽table詳解

標(biāo)簽：滄州紅河樂(lè)山長(zhǎng)治沈陽(yáng) 新疆上海河南

巨人網(wǎng)絡(luò)通訊聲明：本文標(biāo)題《從Table向Css過(guò)渡的優(yōu)缺點(diǎn)比較》，本文關(guān)鍵詞；如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問(wèn)題，煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們，我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò)，涉及言論、版權(quán)與本站無(wú)關(guān)。

佳木斯湛栽影视文化发展公司

從Table向Css過(guò)渡的優(yōu)缺點(diǎn)比較

QQ咨詢

電話咨詢