CSS的四种布局方式static/relative/fixed/absolute

static 

static布局是HTML元素默认的布局方式,并且static布局的元素不会受到top/left/bottom/right属性的影响。布局元素的位置即其在标准文档流中的位置。

relative 

相对布局是相对其在标准文档流中的位置而言的。设置其top/left/bottom/right属性会使该元素脱离标准文档流,但是其在标准文档流中的位置依然被保留,不会被其他元素填补。

fixed 

fixed布局是相对于屏幕视点进行定位的,意味着即使拖动页面滚动轴移动时,采用该布局的元素相对屏幕的位置不发生改变。 

fixed布局可以使用top/left/bottom/right进行定位,采用fixed布局的元素完全脱离了标准文档流,其原来在标准文档流中的位置会被其他元素占据;

absolute 

绝对定位元素是相对于其最邻近的已定位的祖先元素进行定位的。如果一个绝对定位的元素没有已定位的祖先元素,则使用document body作为已定位元素。这里所说的“已定位元素”指的是采用除了static以外的布局方式父元素,包括采用absolute定位的父元素。 

你可能感兴趣的:(CSS的四种布局方式static/relative/fixed/absolute)