上節我們介紹了部分DIV布局屬性,這一節接著向大家介紹,首先看一下絕對位置屬性,絕對位置屬性有四個屬性:top、right、bottom和left,屬性值為長度單位或百分數。
DIV絕對位置屬性:
絕對位置屬性有四個屬性:top、right、bottom和left,屬性值為長度單位或百分數:
◆屬性名稱:'top'、'right'、'bottom'、'left'
屬性值:<length><percentage>auto
初始值:none
適合對象:所有元素
是否繼承:no
百分比備注:被禁止
利用以上屬性,用戶就可以精確定義元素的位置,如:
- <PstylePstyle="position:relative;margin-right:10px;left:10px;">
- Iusedtworedhyphenstoserveasachangebar.They
- will"float"totheleftofthelinecontainingTHIS
- <SPANstyleSPANstyle="position:absolute;top:auto;left:0px;
- color:red;">--</SPAN>
- 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而定