DIV與SPAN
區(qū)隔標(biāo)記(DIV)與SPAN都同于排版與布局塔沃。
區(qū)別在于:DIV是一個(gè)塊級元素阳谍,可以包含段落、標(biāo)題鸽疾、表格乃至章節(jié)训貌、摘要和備注內(nèi)容等冒窍;而SPAN只是行內(nèi)元素豺鼻,其前后不會(huì)換行,沒有結(jié)構(gòu)的意義儒飒。
DIV+CSS排版
DIV+CSS排版布局的一般步驟:
1.從整體上進(jìn)行DIV標(biāo)記的分塊,描述出網(wǎng)頁的抽象圖附帽。
2.對各塊DIV進(jìn)行定位布局圣猎。
3.在網(wǎng)頁中添加相應(yīng)的DIV內(nèi)容乞而。
DIV+CSS布局的美化
采用嵌套DIV的方法,將不同幾列放進(jìn)一個(gè)DIV中欠啤,可達(dá)到幾列底部對其的目的屋灌,從而可以設(shè)置頁腳。
DIV+CSS與傳統(tǒng)表格布局額對比
利用傳統(tǒng)的表格布局可以很輕松的將整個(gè)頁面劃分成需要的模塊共郭,但是表格布局方式在網(wǎng)頁設(shè)計(jì)的最初就要確定頁面的布局形式,一旦確定下來就無法再更改了写半,因此具有極大的缺陷尉咕。而CSS+ DIV布局則完全不同,網(wǎng)頁設(shè)計(jì)者首先考慮的不是如何確定頁面的最終布局形式悔捶,以及如何將網(wǎng)頁內(nèi)容分布到網(wǎng)頁中去单芜,而是首先去分析網(wǎng)頁的內(nèi)容之間的相互邏輯關(guān)系,找出內(nèi)容的層次洲鸠,然后使用DIV或其他標(biāo)記組織網(wǎng)頁的內(nèi)容,最后在考慮網(wǎng)頁的形式如何與內(nèi)容相適應(yīng)淤齐。
CSS布局與傳統(tǒng)表格布局最大區(qū)別在于:
傳統(tǒng)表格布局定位采用表格,通過表格的間距或者用無色透明的GIF圖片來控制各布局版塊的間距更啄;而CSS布局采用層(DIV)來定位,通過層的margin,padding,border等屬性來控制版塊的間距内狗,從而使得CSS+DIV布局具有頁面加載速快义锥、布局靈活、便于動(dòng)態(tài)程序前嵌入的優(yōu)點(diǎn)赂鲤。