解析DIV布局之四大屬性用法
在學(xué)習(xí)網(wǎng)頁(yè)布局的過(guò)程中,你對(duì)DIV布局的屬性是否了解,在以前的HTML里,元素的位置只能靠元素的依次排列覺(jué)得,而在CSS里你可以更精確的定位元素。
DIV布局屬性:
在以前的HTML里,元素的位置只能靠元素的依次排列覺(jué)得,而在CSS里你可以更精確的定位元素。Netscape曾提出過(guò)Layer標(biāo)記,它對(duì)于精確布局很有好處,但是并沒(méi)有被W3C承認(rèn),W3C在CSS提出了類(lèi)似于Layer標(biāo)記的功能。
◆DIV布局之position屬性:
position屬性用來(lái)決定元素的位置類(lèi)型,詳見(jiàn)屬性:
屬性名稱(chēng):'position'
屬性值:absoluterelativestatic
初始值:static
適合對(duì)象:所有元素
是否繼承:no
百分比備注:被禁止
其屬性值分別代表:
absolute:屏幕上的絕對(duì)位置。
relative:屏幕上的相對(duì)位置。
static:固有位置。
◆DIV布局之direction屬性:
direction屬性決定BOX的排列方向,詳見(jiàn)屬性:
屬性名稱(chēng):'direction'
屬性值:ltrrtl
初始值:ltr
適合對(duì)象:所有元素
是否繼承:yes
百分比備注:被禁止
◆DIV布局之float和clear屬性:
在HTML中圖片可以選擇飄浮的位置,現(xiàn)在BOX對(duì)象通過(guò)CSS對(duì)于也可以選擇飄浮的位置。改變BOX的float屬性,BOX將飄浮在其他元素的左或右方:
屬性名稱(chēng):'float'
屬性值:leftrightnone
初始值:none
適合對(duì)象:所有元素
是否繼承:no
百分比備注:被禁止
例如:
- <STYLEtypeSTYLEtype="text/css">
- IMG{float:left}
- BODY,P,IMG{margin:2em}
- </STYLE>
- <BODY>
- <P>
- <IMGsrcIMGsrc=http://blog.soso.com/qz.q/img.gif>
- Somesampletextthathasnoother...
- </BODY>
◆相反的,使用clear屬性將禁止元素在BOX的左方或右方飄?。?/p>
屬性名稱(chēng):'clear'
屬性值:leftrightbothnone
初始值:none
適合對(duì)象:所有元素
是否繼承:no
百分比備注:被禁止
【編輯推薦】