自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

解析四大DIV布局(Layout)屬性用法

開發(fā) 前端
Netscape曾提出過Layer標(biāo)記,它對(duì)于精確布局很有好處,但是并沒有被W3C承認(rèn),W3C在CSS提出了類似于Layer標(biāo)記的功能,這里向大家描述一下DIV布局(Layout)屬性的用法。

在以前的HTML里,元素的位置只能靠元素的依次排列覺得,而在CSS里你可以更精確的定位元素,這里和大家分享一下DIV布局(Layout)屬性,主要包括position屬性,direction屬性,float和clear屬性等內(nèi)容。

DIV布局(Layout)屬性:

在以前的HTML里,元素的位置只能靠元素的依次排列覺得,而在CSS里你可以更精確的定位元素。Netscape曾提出過Layer標(biāo)記,它對(duì)于精確布局很有好處,但是并沒有被W3C承認(rèn),W3C在CSS提出了類似于Layer標(biāo)記的功能。

◆position屬性:

DIV布局屬性中position屬性用來決定元素的位置類型,詳見屬性:

屬性名稱:'position'

屬性值:absolute|relative|static

初始值:static

適合對(duì)象:所有元素

是否繼承:no

百分比備注:被禁止

其屬性值分別代表:

absolute:屏幕上的絕對(duì)位置。
relative:屏幕上的相對(duì)位置。
static:固有位置。

◆direction屬性:

DIV布局屬性中direction屬性決定BOX的排列方向,詳見屬性:

屬性名稱:'direction'

屬性值:ltr|rtl

初始值:ltr

適合對(duì)象:所有元素

是否繼承:yes

百分比備注:被禁止#p#

◆float和clear屬性:

在HTML中圖片可以選擇飄浮的位置,現(xiàn)在BOX對(duì)象通過CSS對(duì)于也可以選擇飄浮的位置。改變DIV布局屬性中BOX的float屬性,BOX將飄浮在其他元素的左或右方:

屬性名稱:'float'

屬性值:left|right|none

初始值:none

適合對(duì)象:所有元素

是否繼承:no

百分比備注:被禁止

例如: 

  1. <STYLEtypeSTYLEtype="text/css"> 
  2. IMG{float:left}  
  3. BODY,P,IMG{margin:2em}  
  4. </STYLE> 
  5. <BODY> 
  6. <P> 
  7. <IMGsrcIMGsrc=img.gif> 
  8. Somesampletextthathasnoother...  
  9. </BODY> 
  10.  

 ◆相反的,使用clear屬性將禁止元素在BOX的左方或右方飄?。?/p>

屬性名稱:'clear'

屬性值:left|right|both|none

初始值:none

適合對(duì)象:所有元素

是否繼承:no

百分比備注:被禁止
 

【編輯推薦】

  1. clear屬性在CSS中的妙用
  2. JavaScript動(dòng)態(tài)創(chuàng)建div屬性和樣式
  3. 14大CSS工具提高網(wǎng)頁設(shè)計(jì)效率
  4. 五大CSS3新技術(shù)用法指導(dǎo)
  5. 解讀DIV CSS網(wǎng)頁布局中CSS無效十個(gè)原因

 

 

責(zé)任編輯:佚名 來源: hi.baidu.com
相關(guān)推薦

2010-08-17 09:20:28

DIV布局

2010-08-17 10:31:10

DIV布局屬性

2010-09-10 10:10:36

CSS屬性

2010-09-02 15:12:28

CSS屬性值選擇器

2010-08-16 16:27:42

DIV布局屬性

2010-08-13 14:45:58

Flex4布局

2010-09-14 17:33:55

DIV+CSS布局

2010-07-14 14:46:57

Perl操作符

2010-07-05 11:12:43

常用UML圖

2010-08-17 09:31:08

DIV布局

2010-08-20 15:43:00

Div CSSSEO

2010-09-02 09:44:07

DIV+CSSSEO

2010-09-09 13:25:52

DIVScroll

2010-08-16 14:12:44

DIV+CSS

2010-09-03 13:02:04

CSSposition

2010-09-15 14:00:06

position屬性DIV

2010-08-13 14:39:57

Flex布局

2010-08-16 10:18:53

DivCSS

2010-08-05 10:22:46

Flex效果

2010-08-26 13:17:13

margin負(fù)值
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)