DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> DIV布局屬性用法詳盡解讀(1)
DIV布局屬性用法詳盡解讀(1)
編輯:CSS詳解     

上節我們介紹了部分DIV布局屬性,這一節接著向大家介紹,首先看一下絕對位置屬性,絕對位置屬性有四個屬性:top、right、bottom和left,屬性值為長度單位或百分數。

DIV絕對位置屬性:

絕對位置屬性有四個屬性:top、right、bottom和left,屬性值為長度單位或百分數:

◆屬性名稱:'top'、'right'、'bottom'、'left'

屬性值:<length><percentage>auto
初始值:none
適合對象:所有元素
是否繼承:no
百分比備注:被禁止
利用以上屬性,用戶就可以精確定義元素的位置,如:

  1. <PstylePstyle="position:relative;margin-right:10px;left:10px;">
  2. Iusedtworedhyphenstoserveasachangebar.They
  3. will"float"totheleftofthelinecontainingTHIS
  4. <SPANstyleSPANstyle="position:absolute;top:auto;left:0px;
  5. color:red;">--</SPAN>
  6. Word.</P>

◆DIV布局之z-index屬性:

在CSS中允許元素的重疊顯示,這樣就有一個顯示順序的問題,z-index屬性描述了元素的前後位置,如果把電腦屏幕看作X-Y平面的話,那麼Z軸就是垂直於屏幕的,z-index使用整數表示元素的前後位置,數值越大,就會顯示在相對靠前的位置,並且CSS同意在z-index中使用負數。
屬性名稱:'z-index'
屬性值:auto<integer>
初始值:auto
適合對象:使用position屬性的元素
是否繼承:no
百分比備注:被禁止

◆DIV布局之width屬性:

規定BOX的width屬性,可以使BOX的寬度不依靠它所包含的內容的多少:
屬性名稱:'width'
屬性值:<length><percentage>auto
初始值:auto
適合對象:塊元素
是否繼承:no
百分比備注:根據父元素的width而定

◆在CSS中還提供了min-width和max-width屬性,使得BOX的寬度在最小寬度和最大寬度之間。

屬性名稱:'min-width'

屬性值:<length><percentage>
初始值:0
適合對象:all
是否繼承:no
百分比備注:根據父元素的width而定

屬性名稱:'max-width'

屬性值:<length><percentage>
初始值:100%
適合對象:all
是否繼承:no
百分比備注:根據父元素的width而定

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved