css中position初解

positon:static|absolute|relative|fiexd

1、static为默认值，没有定位，元素出现在正常的文档流中，忽略left,right,top,bottom,i-index值。

2、absolute为绝对定位，通过left,top等值对元素进行定位，定位时如果父元素的position值为默认值static，就根据文档左上角的位置进行定位，如果不是就根据父元素的位置进行定位，元素脱离文档流。

3、relative为相对定位，也是通过left,top等值对元素定位，定位时根据自己当前的位置进行定位，元素没有脱离文档流。其他元素没有进行位置移动时，相对定位元素可能会和其他元素重叠。

4、fiexd为固定定位，固定定位和绝对定位很类似，但是他定位是相对于浏览器窗口，并且不会随滚动条进行滚动。也就是说，不管用户停留在页面那个地方，固定定位的元素将始终停留在页面的一个地方。固定定位最常见的一种用途就是在页面中创建一个固定头部、或者脚部、或者固定页面的一个侧面。就算是用户移动浏览器的滚动条，还是固定在页现与用户交流。

转载于:https://www.cnblogs.com/hg0209/p/5496285.html

css中position初解相关推荐

CSS中position的几个属性值
CSS中position的几个属性值 position的四种取值 : static:static定位就是不定位,出现在哪里就显示在哪里,这是默认取值,只有在你想覆盖以前的定义时才需要显示指定 ...
css中position属性（absolute/relative/static/fixed）
css中position属性(absolute/relative/static/fixed): position:static 无特殊定位,是html元素默认的定位方式,对象遵循正常文档流.top ...
【拼爹坑爹不比爹】深入理解css中position属性及z-index属性
总结:拼爹坑爹不比爹 1,定位移动:距左上角left+top;(移动后对于移动前:如果值为负数,则直接换成整数:如果值为整数,则直接改变相对方向.) 2,单一父元素不设值,子z-index才奏效:&q ...
CSS中position的relative和absolute.
2021 first note CSS中position的relative和absolute. 之前接触过, 听老师讲的时候, 赶脚自己挺明白的, 后来就放下了, 最近又开始复习, 发现有些熟悉但更多 ...
css中position:fixed为啥下面还要设置一个div的height
css中position:fixed会造成"高度塌陷". 高度塌陷: 父元素包含子元素,子元素设置为浮动且父元素的height为auto或者不设置height,子元素就会脱离文档流 ...
关于CSS中position属性和overflow属性的使用小结
关于CSS中position属性和overflow属性的使用小结 position属性用于设置某个元素的位置类型.取值类型可以有:static.relative.absolute.fixed.inh ...
CSS中position属性值有哪些？
CSS中position属性值有哪些? 1.position:relative;相对定位 1> 不影响元素本身特性(无论区块元素还是内联元素会保留其原本特性) 2> 不会使元素脱离文档流( ...
css中position的4个取值的含义
css中position的4个取值的含义一.在我们书写css代码的时候,position取值有4个,分别是: 1. Absolute:绝对定位,是相对于最近的且不是static定位的父元素来定位 2 ...
CSS中position的4种定位详解
大家都知道,css中的position有4种取值,分别是static.fixed.relative.absolute. 详细解释: static:相当于没有定位,元素会出现在正常的文档流中. fixe ...

css中position初解

css中position初解相关推荐

最新文章

热门文章