初學(xué)者用div+css結(jié)構(gòu)寫網(wǎng)頁的幾個誤區(qū)
網(wǎng)頁的制作中對于用div和css結(jié)構(gòu)寫靜態(tài)頁目前已經(jīng)很成熟,但許多新入行的朋友對于使用div和css結(jié)構(gòu)還有很多誤區(qū),這些誤區(qū)也是我曾經(jīng)經(jīng)歷過的并且被“老鳥”指正的地方,所以總結(jié)下來分享給大家,希望對寫網(wǎng)頁有所幫助。
1、用div+css結(jié)構(gòu)制作靜態(tài)html網(wǎng)頁不等于徹底拋棄古老的table寫法。之所以不建議用table來布局網(wǎng)頁是因為在網(wǎng)頁加載很慢的時候要等table結(jié)構(gòu)加載完成才能看到網(wǎng)頁,其次是table的布局沒有一定的語義,網(wǎng)頁代碼修改起來比較麻煩。
在寫一些欄目塊時,特別是數(shù)據(jù)分類較多,比如“求購信息”的欄目塊,頂部可能出現(xiàn)“發(fā)布人、發(fā)布時間、信息標(biāo)題、聯(lián)系方式”等項目,像這樣的地方建議還是要用table來寫,因為table是專門用來寫數(shù)據(jù)表格的,控制起來很方便,而且符合語義要求,還有頁面中出現(xiàn)類似excel數(shù)據(jù)的地方,也建議用table來寫。
2、div+css結(jié)構(gòu)不等于通篇區(qū)域都用div包起來。遇到一個區(qū)塊就用一個div標(biāo)簽,這樣你寫完代碼后全篇都是div,失去了語義的存在價值,區(qū)塊修改起來也不容易找到,合理的利用dl、ul、ol、span、等標(biāo)簽,不僅讓你的網(wǎng)頁看起來條理清晰,而且修改起來很方便,見名知意,比如你要修改一個新聞列表,先找到新聞列表所在的div或者dl標(biāo)簽,然后再找其中的ul,修改具體內(nèi)容就很容易。
3、并不是css文件一定要和html代碼分開。之所以將css文件和html分開,是因為有些css同時為多個頁面服務(wù),而用戶訪問時css文件可以緩存在本地,這樣下次再訪問其他頁面時就不用重復(fù)加載css,可以節(jié)約時間和流量,提高訪問速度,但是如果你的頁面有些區(qū)域的css是獨(dú)一無二的,其他頁面用不到的,就不用把css剝離出去,直接用style標(biāo)簽包括在html網(wǎng)頁里就可以。
4、用div和css寫網(wǎng)頁一定要在不同類型和不同版本的瀏覽器進(jìn)行測試。建議最好是同時打開多個瀏覽器,如果說你認(rèn)為你的網(wǎng)站訪客還沒有養(yǎng)成使用火狐、谷歌等瀏覽器的習(xí)慣,那最少也得兼容ie6、7、8幾個版本,由于軟件限制,沒有辦法在一個電腦上裝不同版本的多個瀏覽器,因此要借助版本模擬軟件,我常用的是ietest,用來測試網(wǎng)頁足夠了。
對于經(jīng)驗不太豐富的頁面制作者來說最好是寫一個小區(qū)塊就在不同瀏覽器下看一看效果,如果出現(xiàn)問題可以及時調(diào)整代碼,不要只在一個瀏覽器里測試,一口氣寫完,那么當(dāng)你在其他瀏覽器測試時發(fā)現(xiàn)網(wǎng)頁奇形怪狀時你就暈頭了。
--- 版權(quán)最終歸艾銻無限所有http://www.richjn.cn/ 如需轉(zhuǎn)載,請標(biāo)明出處。
相關(guān)文章