更新時(shí)間:2021-04-27 來(lái)源:黑馬程序員 瀏覽量:
單列布局雖然統(tǒng)一、有序,但常常會(huì)讓人覺(jué)得呆板。所以在實(shí)際網(wǎng)頁(yè)制作過(guò)程中,通常使用另一種布局方式——兩列布局。兩列布局和單列布局類(lèi)似,只是網(wǎng)頁(yè)內(nèi)容被分為了左右兩部分,通過(guò)這樣的分割,打破了統(tǒng)一布局的呆板,讓頁(yè)面看起來(lái)更加活躍。如圖1所示,就是一個(gè)“兩列布局”頁(yè)面的結(jié)構(gòu)示意圖。
圖1 兩列布局
在圖1中,內(nèi)容模塊被分為了左右兩部分,實(shí)現(xiàn)這一效果的關(guān)鍵是在內(nèi)容模塊所在的大盒子中嵌套兩個(gè)小盒子,然后對(duì)兩個(gè)小盒子分別設(shè)置浮動(dòng)。
猜你喜歡:
什么是網(wǎng)頁(yè)布局?DIV+CSS技術(shù)的布局流程是怎樣的?