2015-09-22 css2

6.块元素和行内元素

1. 块元素特点：默认显示在父标签的左上角

块级元素默认占满一行（占满整个文档流）

常见的块元素：p,h1--h6,ul li, ol li,div,hr,table.

2.行内元素（内联元素）：大小受到文字区域影响，不受到width，height影响

行内元素不会单独占满一行

常见的行内元素：a,span,img,input .

3.块元素和行内元素转换

块元素----->行内元素 display：inline

行内元素--->块元素   display：block

display：inline-block 具有块元素和行内元素的特点：1.width，height受到影响

2.不会单独占满一行

7.块元素浮动

float：left左浮动，right右浮动

clear：both----清除左右浮动

8.内间距padding 外间距margin

padding：10px 10px 10px 10px---上右下左（撑开10px）

margin： 10px 10px 10px 10px外间距

padding对于行内元素是支持的，margin对于行内元素只支持左和右

9.绝地定位和相对定位

position：absoulte；

1.当设置为绝对定位后，脱离了文档流，不会单独占满一行，不会受到浮动的影响

2.当设置为绝对定位时，元素的方位就受到窗体的top，left，right，bottom的影响。

position： relative；

1.当设置为相对定位时，没有脱离文档流

2.当设置为相对定位时，方位是相对于元素的父标签，由于标签并没有脱离文档流，所以它四周的标签是占着位置的。

position：fixed；-----固定显示在某一处（脱离）。如：top：0px； right：0px；