CSS中的位置属性使用了详细的解决方案。

职位有4个属性:静态相对绝对固定,我们都知道,绝对是绝对定位,相对是相对定位,但是这个绝对相对的意思吗绝对,哪里是绝对的,相对于什么地方是相对于它的呢他们有什么特点,他们能起什么作用





CSS2.0的解释:

此属性值设置为绝对会把对象从正常文档流而不考虑它周围的内容布局。如果其他不同z-index属性的对象占据一个给定的位置,他们不互相交流,并将堆放在同一位置。在这一点上,对象不有一个外部的补丁(保证金),但仍有内部补丁(填料)和边界(边界)。
激活的绝对(绝对)位置的对象,我们必须指定至少一个在左,右,顶部和底部的属性,并设置该属性值为绝对的。否则,这些属性将使用默认值自动,这将使对象符合标准的HTML布局规则和立即的以前的对象了。

该Trbl属性(顶部,底部,右,左)只有位置属性设置是有效的。
当设置位置时:绝对
如果父(无限)不设置位置属性,那么当前的绝对结合TRBL属性在浏览器的左上角找到源点
如果父(无限)集的位置属性,目前的绝对结合TRBL属性在父的左上角定位原始点(最近的)。

设置位置时:相对
指的是家长的内容区域的左上角(最近的)内容,该Trbl属性是用来定位(或者说抵消母内容区域的最后一个元素)。没有母体,身体的左上角是原点,相对定位不能叠加,在相对定位的情况下,不管元素是否移动,元素仍然占据原来的空间,因此移动元素使它覆盖其他的帧。

一般来说,如果网页是居中的,很容易犯绝对的错误,因为网页总是适合于分辨率。绝对会以浏览器的左上角为原点,它不应该改变分辨率的位置。有时需要依靠z-index设置容器的关系,顶部的更多的价值,一个自然数的数值范围。当然,需要注意的是,爸爸儿子的关系不能建立了Z指数很重要,它必须在上层路基。

设置此属性值相对会保持对象在正常的HTML流,但其位置可以抵消根据其以前的对象。文本或对象在相对(相对)对象占据自己的空间,不包括位于对象的自然空间。不同的文本或对象后,绝对(绝对)定位对象占据的自然空间在定位对象被拖离正常文档流。放置一个绝对的(绝对)定位对象的可视区域外导致滚动条的外观,而将相对(相对)定位对象的可视区域外,滚动条不不会出现。事实上,对于定位的主要问题是要记住每个位置的意思,相对位置是相对于;文档流中元素的初始位置,绝对位置相对于最近的祖先元素。

以下是补编:

虽然CSS的绝对定位(绝对)和相对位置(相对)是已知的,但它从未写过相关的效果!
我已经忙了很长时间了,已经结束了!这两个属性也被理解。

摘要如下:

首先看看下面的层结构


复制代码代码如下所示:


此层只适用于位置:相对;样式。
此层只适用于位置:绝对式;样式。
非应用样式




1,绝对:不占有,相对:有位置!

比如上层建筑:

当显示关系层时,id将使用一行!它后面的abs层只会显示在下一行中!
当为ABS显示ID层时,它与SSS的后面ID重叠!

2。默认情况下(不与顶部相结合),绝对(绝对定位)位于父层。
如果上述ID ABS层,如果不加上定位,显示位置将父亲的位置(在文档的左下角位置层,它会在左下角)

3,当与顶部、底部、左右两个属性相结合时,绝对(绝对位置)是由Windows定位的,而相对以自己的职业作为基线来进行偏移:


复制代码代码如下所示:


非应用样式
这一层应用位置:相对底部:30px;风格;
这层仅适用于位置:绝对底部:30px;风格;




上面的代码:
ID层将移动到相对点,并与ID层重叠为SSS。
abs层的ID将以窗口为基线,并从窗口移动到30像素位置!

4、结合性能如顶部,底部,当左右,如果你想要绝对(绝对定位)以父层作为基线,然后申请的绝对或相对的父层的属性。


复制代码代码如下所示:


这一层应用位置:相对底部:30px;风格;
这层仅适用于位置:绝对底部:30px;风格;




上面的代码:ID是定位的层,和绝对的性质可以用!
id是一个相对的层,没有受到影响,它自己的占用作为基线。

ABS的ID层是基于身份地位层基地为定位基准。如果位置层高度小于30px此时ABS层可能无法看到它!

个人总结:

位置:位置:相对和绝对可以在文档改变元素的位置,所有这些可以激活左,上,右,下,和元素z-index属性。(默认情况下这些属性没有被激活,设置无效)

设置位置:相对位置:绝对值将浮动所有元素并在正常情况下改变文档流。

不同:

位置:相对将z-index保留自己的入住率:0层,和左,右,上,下值z-index层相对位置。

位置:绝对会完全脱离文档流,没有Z指数:0层保留其左,上,右,下值的占位符,是相对最近的一组位置:位置:相对或绝对的祖先元素,如果不设置所有祖先元素,然后用身体元素的比较