講述采用div+CSS設計網(wǎng)頁和TaBLE之間區(qū)別

2021-10-20    分類: 網(wǎng)站建設

在網(wǎng)站推廣中,幾年前div+CSS開始逐漸成為網(wǎng)頁設計的選方式,目前來看,div+CSS已成為網(wǎng)頁設計的標準,國內非常多的網(wǎng)站在這幾年已完成了從TaBLE到div+CSS的重構。那么div+CSS相比TaBLE,它具有哪些優(yōu)勢呢
網(wǎng)頁設計采用div+CSS,大的優(yōu)勢是實現(xiàn)網(wǎng)頁代碼的標準化,摒棄過時的表格布局方式,實現(xiàn)了內容、表現(xiàn)和行為這3者間的分離,html代碼結構性更好,閱讀和維護更容易,同時網(wǎng)頁文件大小也更小。
div+CSS與TaBLE方式在設計時差別很大,網(wǎng)頁開始設計前需要仔細規(guī)劃,比如對組成網(wǎng)頁的網(wǎng)站推廣各部分元素命名,方便在css中進行樣式定義,公共屬性部分最好用類名定義。整個網(wǎng)站通用的樣式可以放到單獨的一個css文件中,常有的公共屬性有:網(wǎng)頁寬度、背景顏色、背景圖片、字體默認大小、顏色、鏈接樣式等,每個網(wǎng)頁不同的樣式在css文件中最好集中一塊,并在塊前說明是哪個網(wǎng)頁或哪個網(wǎng)頁部分,這樣既精簡css文件大小,又避免出現(xiàn)混亂,對維護也更方便。值得一提的是,網(wǎng)頁代碼中不要嵌入樣式,徹底實現(xiàn)內容和樣式的分離。做好div+CSS的網(wǎng)頁設計,深圳網(wǎng)頁設計公司覺得有三點需要重點理解。
1、float屬性:div(層)默認是占據(jù)一整行,對于常見的兩列或多列布局的設計,需要能夠正確設置float及width屬性實現(xiàn)效果。多列布局結束后如果跟了一個占據(jù)通欄的層,此時需要設置clear屬性清除層浮動。
2、盒模式:層具有寬度width、高度height、邊框border、內間距padding和外間距margin等屬性,而層實際占據(jù)的空間是上述屬性值相加的大小,合理運用這些屬性能實現(xiàn)緊湊而又美觀的網(wǎng)頁布局。
3、層嵌套:有經(jīng)驗的網(wǎng)頁設計師都知道層不宜嵌套過多,一般不超過3層,嵌套過多的會導致代碼復雜冗余、維護困難及運行慢的問題。另外,在多列布局時完全可以用層浮動實現(xiàn),不需要整體設置一個ie層來嵌入。

網(wǎng)站題目:講述采用div+CSS設計網(wǎng)頁和TaBLE之間區(qū)別
分享網(wǎng)址:http://muchs.cn/news/132032.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供移動網(wǎng)站建設、做網(wǎng)站、商城網(wǎng)站動態(tài)網(wǎng)站、電子商務定制開發(fā)

廣告

聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

商城網(wǎng)站建設