1、html中的标签可以分为两种标签,一种为内联标签,一种为块级标签。
内联标签:1、内联标签之间依次从前往后排列,直到排列不下再从上往下排列
2、内联标签中不能包含块级标签,只能包含内联标签
3、内联标签不能设置height,width属性,margin,padding只能设置左右,不能设置上下
4、对应的display属性为inline
5、没有设置宽度时,宽度占上一级标签的100%
块级标签:1、块级标签独自占一行,从上往下依次排列
2、块级标签可以包含块级标签,可以包含内联标签
3、height,width,margin,padding属性都可以设置
4、对应display属性为block
5、没有设置宽度时,宽度为内容的宽度
注:display:inline-block 不独占一行,跟内联标签第一条性质相同;可以设置height,width,margin,padding和块级标签的第三条相同,因此具有内联标签和块级标签的性质。
2、常用的块级,内联标签有
块级标签:div,p,ul,ol,form,table,h1
内联标签:img,a,input,span,testarea
3、css的4种引入方式
4、标签的选择方式
*选择全部,标签名,根据id和class选择。“,”并列、“空格”后代选择、“>”子代选择、“+”毗邻选择。还可以根据属性选择。
5、margin排序为上右下左
6、float现象
float是css中一个非常重要的内容,有left,right。
float属性设置后,会部分脱离文档流,即块级标签会当做它不存在而排列,而内联标签和文本会把它当做内联标签,在其后依次排列,该特性有点像内联标签。
7、position定位
position定位也是css中的一个重要内容
position定位的默认值为static,表示不定位,不能当做参照物,因为不能进行其他设置。
position:relative,相对定位,相对于自身进行定位,可设置left,right,top,bottom;但是标签仍然处于正常的文档流中。一般用于做子代的参照物。可以设置float。
position:absolute,绝对定位,相对于已经定位的父级标签定位,可设置,left,right,top,bottom,脱离正常的文档流,处于定位流中,不可设置float。
position:fixed,固定定位,在文档中的位置固定,不随滑轮的移动移动。脱离正常的文档流,处于定位流中,不可设置float。定位流不同于float流。
设置float和position,相当于给标签加上display:block