聖杯布局:主要是利用float position 以及margin為負值控制邊界
>
>
charset
="utf-8"
>
>
title
>
type
="text/css"
>
*body
#header,#footer
#content
#content .middle,#content .left,#content .right
.middle
.left
.right
/* 清除浮動是為了撐開父級高度 */
.clearfix
.clearfix:after
style
>
head
>
>
"header"
>
headerdiv
>
"content"
class
="clearfix"
>
class
="middle"
>
middle
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
middle
/>
div>
class
="left"
>
leftdiv
>
class
="right"
>
rightdiv
>
div>
"footer"
>
footerdiv
>
body
>
html
>
雙飛翼布局
最好不要出現定位,會可能有層級問題,所以就出現了雙飛翼,
聖杯布局中相對定位用來將left和right移動向兩端
>
>
charset
="utf-8"
>
>
title
>
type
="text/css"
>
*body
/*頭部 腳部樣式*/
#header,#footer
/*三列的偽等高布局*/
#content .middle,#content .left,#content .right
/*雙飛翼布局*/
#content
#content .middle
//不同之處!!!!
#content .middle .m_inner
#content .left,#content .right
#content .left
#content .right
style
>
head
>
>
"header"
>
>
headerh4
>
div>
"content"
>
class
="middle"
>
class
="m_inner"
>
middle
div>
div>
class
="left"
>
leftdiv
>
class
="right"
>
rightdiv
>
div>
"footer"
>
>
footerh4
>
div>
body
>
html
>
css2 1的一些深入了解(1)
最近感覺晚上9點以後有點閒,每天補充一點深入了解的東西,算是能加快進度吧 1.定位,包含塊,預設值問題 視口和包含塊不是乙個東西 初始包含塊是乙個視窗大小的矩形 對於設定有position屬性的元素,若position relative或者static那麼包含塊為最近的塊級祖先元素的內容區域 對於乙...
您對CSS 2 1的了解
css 2修訂版1已經作為候選建議發布了將近兩個月,但令人驚訝的是,網上對此的討論很少。這是乙個有趣的規範,任何有標準意識的web開發人員都應該意識到。css 2.1對css 2進行了修訂,以更好地反映瀏覽器市場的當前狀況,並借鑑自css 2發布以來的四年經驗。它修剪掉了整個css社群從未真正採用的...
css限定字元 您對CSS 2 1的了解
css限定字元 css 2修訂版1已作為候選建議發布了將近兩個月,但令人驚訝的是,網上對此討論很少。這是乙個有趣的規範,任何有標準意識的web開發人員都應該意識到。css 2.1對css 2進行了修訂,以更好地反映瀏覽器市場的當前狀況,並借鑑自css 2發布以來的四年經驗。它刪除了整個css社群從未...