positioncss，在CSS中position： relative是什么意思
亲爱的读者们，你是否对positioncss和在CSS中position: relative是什么意思的相关问题感到困惑？别担心，今天我将为你解答这些问题，让你对此有更清晰的认识。
在CSS中position: relative是什么意思
在CSS中，“position: relative”是设置定位类型为相对定位，它可以配合“top”、“bottom”、“left”、“right”这4个偏移量来实现相对它所属父元素的相对定位。
position属性规定元素的定位类型，这个属性定义建立元素布局所用的定位机制。任何元素都可以定位，不过绝对或固定元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。
relative属性相对比较简单，它是相对它所属父元素来进行偏移的，可以通过“top”、“bottom”、“left”、“right”4个偏移属性进行定位。
扩展资料：
position属性的其它定位类型：
1、absolute
绝对定位，依据父元素中最近设置为relative定位类型的元素进行偏移。
2. fixed
fixed是特殊的absolute，即fixed总是以body为定位对象的，按照浏览器的窗口进行定位。
3. static
position的默认值，一般不设置position属性时，会按照正常的文档流进行排列。
参考资料来源：百度百科-position（定位元素）
Html中的position:absolute的意思
1、“position：absolute”是绝对定位的意思，单纯的使用absolute属性并不会其效果，需要配合“topbottom leftright”属性才能看到效果。首先需要新建一个html文件，这里定义了10个换行符，换行符的下面定义一个div：
2、此时保存文件，打开浏览器可以看到div在浏览器的下方位置，接下来来设置绝对定位，让div显示在任意位置：
3、给divc的class使用absolute属性,并使用上下左右位置属性，设置向上和向左分别50px，接着保存文件：
4、再次打开浏览器，可以看到div的位置在浏览器上方，覆盖了换行符的位置：
css 中position: fixed;是什么意思
position:
fixed用于生成绝对定位的元素，相对于浏览器窗口进行定位。
元素的位置通过
"left",
"top",
"right"
以及
"bottom"
属性进行规定。
position
属性规定元素的定位类型。这个属性定义建立元素布局所用的定位机制。任何元素都可以定位，不过绝对或固定元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。
absolute
生成绝对定位的元素，相对于
static
定位以外的第一个父元素进行定位。
元素的位置通过
"left",
"top",
"right"
以及
"bottom"
属性进行规定。
fixed
生成绝对定位的元素，相对于浏览器窗口进行定位。
元素的位置通过
"left",
"top",
"right"
以及
"bottom"
属性进行规定。
relative
生成相对定位的元素，相对于其正常位置进行定位。
因此，"left:20"
会向元素的
LEFT
位置添加
20
像素。
static
默认值。没有定位，元素出现在正常的流中（忽略
top,
bottom,
left,
right
或者
z-index
声明）。
inherit
规定应该从父元素继承
position
属性的值。
CSS中position属性详解
根据W3C的解释为：position属性规定元素的定位类型，把元素放置到一个静态的、相对的、绝对的、或固定的位置中。
可能的值absolute：生成绝对定位的元素，相对于 static定位以外的第一个父元素进行定位。元素的位置通过"left","top","right"以及"bottom"属性进行规定。
fixed：生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过"left","top","right"以及"bottom"属性进行规定。
relative：生成相对定位的元素，相对于其正常位置进行定位。
static：默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right或者 z-index声明）。
inherit：规定应该从父元素继承 position属性的值。
我们用的最多的absolute和relative，接下来可以通过具体例子来更加直观地体现。
举例一：绝对定位
position: absolute；绝对定位：绝对定位是相对于元素最近的已定位的祖先元素（即是设置了绝对定位或者相对定位的祖先元素）。如果元素没有已定位的祖先元素，那么它的位置则是相对于最初的包含块（body）。
绝对定位本身与文档流无关，因此不占空间，普通文档流中的元素的布局就当绝对定位的元素不存时一样，所以它们可以覆盖页面上其他的元素，且可以通过z-index属性来控制这些层的对方顺序。
#box_relative{
position: absolute;
left: 30px;
top: 20px;
}
二：相对定位
position: relative；相对定位：相对定位是相对于元素在文档中的初始位置——首先它出现在它所在的位置上（即不设置position时的位置，然后通过设置垂直或水平位置，让这个元素“相对于”它的原始起点进行移动；
注意，在使用相对定位时，无论是否进行移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其它框。
#box_relative{
position: relative;
left: 30px;
top: 20px;
}
注意
position:absolute，float会隐式地改变display的类型（display：none除外）。即是当元素设置position:absolute、float:left、float:right中任意一个时，都会让元素以display:inline-block的方式显示（特点是：可以设置长宽，默认宽度不占满父元素）。这时，即使故意设置display:inline; display:block都是无效的。
但是float在IE6下的双边距bug就是用display:inline;来解决的。position:relative不会隐式改变display的类型。
非常感谢您的阅读！我们希望本文对于解决您关于positioncss和在CSS中position: relative是什么意思的问题提供了一些有价值的信息。如果您还有其他疑问，我们将很乐意为您提供进一步的帮助。