時間：2015-06-28 00:00:00 來源：IT貓撲網(wǎng) 作者：網(wǎng)管聯(lián)盟 我要評論(0)
瀏覽器顯示頁面是一行一行的按順序執(zhí)行代碼，也就是說寫在前面的先執(zhí)行顯示，而對于左中右3欄布局的設(shè)計，代碼要么是從左-->中-->右來書寫，要么就是到過來從右-->中-->左來書寫，要做到要求的效果，那首先要書寫的是中欄的代碼。
所以我首先定義了一個id=m的DIV，并且padding-left:150px，定義這個是為了給左欄留出140PX的顯示位置，然后再在這個DIV里面嵌套定義一個id=middle的DIV，我用position:absolute的屬性(絕對定位);然后再定義左欄left和右欄right。用position:absolute的屬性有一個不好的地方就是它象photoshop里的層一樣，它的自動延伸并不會帶動整個布局的延伸，所以會遮住一些頁面元素，比如我們通常會在網(wǎng)站的最下面寫上一些copyright的信息，如果用先顯示中欄的這種方法，如果不做處理的話，這些信息會被遮蓋住。處理的辦法就是使用javascript,讓左右2欄的高度隨中欄一起自動延伸。
|
以下為引用的內(nèi)容： |
關(guān)鍵詞標(biāo)簽：方法,顯示,最先,布局,
相關(guān)閱讀
熱門文章
DIV+CSS網(wǎng)頁布局常用的一些基礎(chǔ)知識整理
完美解決CSS網(wǎng)頁水平居中
XHTML+CSS兼容解決方案
CSS網(wǎng)頁布局困擾新手的八個問題
人氣排行 DIV CSS完美兼容IE6/IE7/FF的通用方法 CSS實例：list-style-type在IE與FF中奇怪的現(xiàn)象解析-CSS布局實例 CSS實例:通過定義漸變邊框給圖片加陰影 CSS常用技巧之一 禁止文字自動換行 網(wǎng)頁頁面設(shè)計中CSS十大注意 解決用CSS控制DIV居中失效的問題 css div設(shè)置float后高度不能自動增加 讓CSS兼容IE和Firefox的技巧集合