网站建设需求说明文档,wordpress自己的网页,做论文常用网站,wordpress win8主题1. relative、fixed、absolute 和 static 四种定位
1. Relative#xff08;相对定位#xff09;#xff1a;
相对定位通过设置 position: relative; 来实现。相对定位相对于元素在文档流中的初始位置进行定位。可以使用 top、right、bottom 和 left 属性来相对于原始位置进…1. relative、fixed、absolute 和 static 四种定位
1. Relative相对定位
相对定位通过设置 position: relative; 来实现。相对定位相对于元素在文档流中的初始位置进行定位。可以使用 top、right、bottom 和 left 属性来相对于原始位置进行偏移。 -相对定位不会使元素脱离文档流其他元素仍然以相对定位元素的原始位置进行布局。
2. Fixed固定定位
固定定位通过设置 position: fixed; 来实现。固定定位使元素相对于视口浏览器窗口进行定位。可以使用 top、right、bottom 和 left 属性来指定元素相对于视口的偏移位置。固定定位的元素不会占据文档流中的空间不受页面滚动的影响。
3. Absolute绝对定位
绝对定位通过设置 position: absolute; 来实现。绝对定位使元素脱离文档流并相对于其最近的已定位祖先元素进行定位。如果没有已定位的祖先元素则- - 相对于初始包含块通常是浏览器窗口进行定位。可以使用 top、right、bottom 和 left 属性来指定元素相对于其定位参考点的偏移位置。绝对定位的元素不会占据文档流中的空间其他元素会忽略它的位置。
4. Static静态定位
静态定位是元素的默认定位方式通过设置 position: static; 来实现通常不需要显式设置。静态定位下元素按照文档流的顺序进行排列不受定位属性的影响。top、right、bottom 和 left 属性对静态定位的元素没有效果。
2. 区别 static默认定位元素的默认定位方式。在静态定位下元素按照文档流的顺序进行排列不受定位属性的影响。top、right、bottom 和 left 属性对静态定位的元素没有效果。 relative相对定位相对定位相对于元素在文档流中的初始位置进行定位。通过设置 top、right、bottom 和 left 属性可以相对于元素原本的位置进行偏移。相对定位不会使元素脱离文档流其他元素仍然以相对定位元素的原始位置进行布局。 absolute绝对定位绝对定位使元素脱离文档流并相对于其最近的已定位祖先元素进行定位如果没有已定位的祖先元素则相对于初始包含块通常是浏览器窗口进行定位。通过设置 top、right、bottom 和 left 属性可以指定元素相对于其定位参考点的偏移位置。绝对定位的元素不会占据文档流中的空间其他元素会忽略它的位置。 fixed固定定位固定定位使元素相对于视口浏览器窗口进行定位即使页面滚动也不会改变其位置。通过设置 top、right、bottom 和 left 属性可以指定元素相对于视口的偏移位置。固定定位的元素不会占据文档流中的空间其他元素会忽略它的位置。
总结
static 是默认定位元素按照文档流排列不受定位属性影响。relative 相对于元素原本位置进行定位不脱离文档流。absolute 相对于最近的已定位祖先元素进行定位如果没有则相对于初始包含块定位脱离文档流。fixed 相对于视口进行定位即使页面滚动也不会改变位置脱离文档流。