块元素(block element)一般是其他元素的容器元素,块元素一般都从新行开始,它可以容纳内联元素和其他块元素,内联元素(inline element)一般都是基于语义级(semantic)的基本元素。内联元素只能容纳文本或者其他内联元素。
当内联元素,在CSS中定义下列属性中的一种,便具有块元素的特征
1)display:block;
2)float:left; (不但具有块元素的特征,同时像左侧浮动)
但是这时候的内联元素,虽然具有块状元素的特征,但是这两种有一点区别,第一种,彻头彻尾和块元素一模一样,都要单独占一行,从左至右,前提没有width和height属性,严格遵循流动布局模型块状元素的流动方式,自上至下流动,第二种,大小是恰好能将内容包含,并且右侧浮动,可以多个在一行。
当加上position:absolute/relative的时候,块状元素和内联元素,就不受父级区域的限制了,可以移动到任何位置,此时如果加上width和height属性,那么就具有层的特征了。(加上width和height还有一点好处,就是可以兼容IE浏览器了,所有的浏览器现实效果都一样了)
试了一下可变元素跟内联元素没什么差别,不过这些元素我就没有用过应该不会用。